中文简体 | English
$> cd your-workspaces
$> git clone [email protected]:oscc-web/ieda-website.git
$> ./setup.sh
$> npm run command -- dev
$> git pull
-
网站所有的资源文件(图片、视频、文件等)是以一个独立的GitHub仓库进行维护的。在执行仓库根目录中的
setup.sh
脚本时,系统会自动将当前网站相配套的资源仓库下载到src/.vuepress/public/res
目录下。用户在文章中添加新图片xxx.png
时,首先需要将其复制到src/.vuepress/public/res/images
中的某个子目录yyy
(最好跟导航栏中的目录名保持一致,没有可创建)中,然后在Markdown文件中使用下面格式进行引用即可:![xxx](/res/images/yyy/xxx.png)
注意:在确认本地资源目录下的新增文件不再发生变化后,需要将终端切换到
src/.vuepress/public/res
目录,然后使用Git提交并Push到远程,保证内容不丢失。 -
网站的导航栏和侧边栏配置分别位于
src/.vuepress/navbar/zh.ts
和src/.vuepress/sidebar/zh.ts
文件中,可以根据需要进行添加或修改。其中需要注意的是,侧边栏排序目前采用的是structure
模式,即框架会读取文件结构自动生成侧边栏,可大大降低用户配置的工作量。但是在这种模式下,侧边栏会按照文件名的标题文字以当前语言进行排序,所以往往生成的顺序并不是我们想要的,为解决这个问题可以在文章的Frontmatter
区域添加order
属性,具体说明可参考这篇教程。 -
本网站主体基于VuePress Theme Hope进行开发,该框架对传统的Markdown进行了定制优化,支持更加丰富的功能。所以,请务必在开始编写文章前,仔细阅读《Markdown》和《Markdown增强》这两篇指南,了解框架提供了哪些强大的组件,并考虑如何将它们应用到自己的文章中,让整体的表现形式更加多样化,从而使得生成的网站文章更容易被大众接受。
-
由于目前网站侧边栏采用自动化技术生成,所以每篇文章头部必须添加
order
属性,该属性表示文章在侧边栏中的顺序,必须从1
开始编号且不能重复,否则每次编译后部分文章在侧边栏中的顺序可能会发生变化,而且也会导致用户点击二级导航栏后无法正确跳转到正确的文章上。--- title: xxx order: xxx ---
-
为了实现展示复杂界面的需求,目前网站集成了Element Plus前端框架,其所有组件和图标都已经注册到项目中,可以直接在Vue组件中使用(图标貌似还得在Vue组件中手动导入)。网站定制的Vue组件都放置在
src/.vuepress/components
目录下,用户可根据需要创建新组件,但是需要注意的是被引用到文章中的组件必须放置在components
目录下(不能放在子目录中),否则会出现引用失败的错误。 -
使用以下命令可一键将网站部署到服务器上,域名为【ysyx.oscc.cc】,账号为一生一芯论坛账号(账号需要有部署权限,找系统管理员开通)。建议先在本地进行测试,没有问题后再部署到服务器上,防止出现各种未知的错误。
$> npm run command -- deploy