Vuepress
# 基本配置
要想实现其他的功能,首先配置文件是必不可少的。
一个 VuePress 网站必要的配置文件是 .vuepress/config.js,它应该导出一个 JavaScript 对象:
module.exports = {
title: 'Hello VuePress',
description: 'Just playing around'
}
# 配置文件大体内容
module.exports = {
title: '君逑的博客',
description: 'blog,sidama,junqiu',
dest: 'dist',// 设置输出目录
head: [ // 注入到当前页面的 HTML <head> 中的标签
['link', { rel: 'icon', href: '/logo.ico' }], // 增加一个自定义的 favicon(网页标签的图标)
['link', { rel: 'stylesheet', href: '/nav.css' }],
],
markdown: {
lineNumbers: false // 代码块显示行号
},
themeConfig: {
nav:[],
smoothScroll: true,
lastUpdated: 'Last Updated', // string | boolean
//sidebar: auto,// 该语法表示使用当前页面标题自动生成侧边栏
sidebar:'auto',
sidebarDepth: 2, // 侧边栏显示2级
}
};
# 创建项目中文档目录
这里我们在 docs 下创建 guide 文件夹以及 README.md 文件,用来存放页面,我们可以创建多个这样的文件夹,每个文件夹看做独立的模块
cd docs && mkdir guide && cd guide && echo '# Hello GUIDE' > README.md
这时候启动项目是没有效果的,我们需要修改 docs/README.md 文件
actionLink: /guide/
这时,重启项目,点击中间的快速上手,就可以跳转到我们刚刚新建的目录了
注意
这里我们只是写了 /guide/ ,后面并没有带 README.md ,但是页面确显示的 README.md 的内容,这时项目的一个默认路径,当在路径后面不带具体的文档名时,他会默认选择当前文件夹下的 README.md 文件,如果找不到就会报 404 错误