VuePress 静态网站生成

使用技术：VuePress - Vue 驱动的静态网站生成器仓库地址：https://github.com/yinian-R/v…全局安装## 安装yarn global add vuepress # 或者：npm install -g vuepress现有项目如果你想在一个现有项目中使用 VuePress，同时想要在该项目中管理文档，则应该将 VuePress 安装为本地依赖。## 没有项目可以初始化yarn init## 将 VuePress 作为一个本地依赖安装yarn add -D vuepress # 或者：npm install -D vuepress## 新建一个 docs 文件夹mkdir docs## 新建一个 markdown 文件echo # Hello VuePress! > docs/README.md## 开始写作npx vuepress dev docs接着，在 package.json 里加一些脚本:{ “scripts”: { “docs:dev”: “vuepress dev docs”, “docs:build”: “vuepress build docs” }}基本配置.├─ docs│ ├─ README.md│ └─ .vuepress│ └─ config.js一个 VuePress 网站必要的配置文件是 .vuepress/config.js，它应该导出一个 JavaScript 对象：module.exports = { title: ‘Hello VuePress’, description: ‘Just playing around’}静态资源创建public文件夹，主要用于存放静态资源.├─ docs│ └─ .vuepress│ └─ public│ └─ image│ └─ favicon.ico添加网站 favicon，修改 .vuepress/config.js 内容module.exports = { head:[ [’link’, {rel:‘icon’, href:’/image/favicon.ico’}] ]};导航栏你可以通过 themeConfig.nav 增加一些导航栏链接:module.exports = { themeConfig: { nav: [ { text: ‘主页’, link: ‘/’ }, { text: ‘配置’, link: ‘/guide/’ }, { text: ‘语言’, items: [ { text: ‘中文’, link: ‘/language/chinese/’ }, { text: ‘English’, link: ‘/language/english/’ } ] }, { text: ‘GitHub’, link: ‘https://github.com’ } ] }};侧边栏想要使 侧边栏（Sidebar）生效，需要配置 themeConfig.sidebar，基本的配置，需要一个包含了多个链接的数组：module.exports = { themeConfig: { sidebar: [ ‘/’, [’/hello’, ‘hello page’] ] }};