基本配置

9/28/2021 vuepress

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 错误

Last Updated: 3/15/2024, 2:13:06 PM