vuepress 使用心得

vuepress 是一款可以用在项目中进行文档开发的工具,它高效、便捷。在使用过程中,有以下心得记录下,以便后期查阅,

1、markdown 要熟悉。

在整个开发中,文字性的编写全靠使用markdown工具。它既可以用文档中的标题生成侧边栏的导航索引,又可以将vue与markdown结合起来,渲染出所需求的东西。

2、侧边栏生成

// 生成侧边栏导航的索引的因素一部分取决于在docs/.vuepress/config文件sidebar和sidebarDepth的配置
module.exports = {
    title:"11",   // 标题
    description: "11", // 描述
    base:'/docsViews/',
    head: [
        ['link', { rel: 'icon', href: '/img/logo.ico' }],
        ['link', { rel: 'manifest', href: '/manifest.json' }],
    ],   // 额外需要注入到当前页面的标签
    themeConfig: {
        nav: [
            { text: '主页', link: '/' },            
            { text: '关于', link: '/about/' },
            { text: 'Github', link: 'https://www.github.com' },
        ],
        sidebar: 'auto',
        sidebarDepth: 2,
        lastUpdated: 'Last Updated', 
    },
}

sidebar具体的配置方法,可参见官方文档;想要根据文档中的标题级别自动生成侧边栏,有两种方法:

//1、在.md文档顶部标注:
---
sidebar: auto
---
// 2、在config文件中的themeConfig中配置
module.export = {
    ...
    themeConfig: {
        sidebar:auto;
    }
}

sidebarDepth设置的值表示侧边栏生成索引嵌套层级。侧边栏显示从H2开始,最多显示到H3,因此,sidebarDepth可选值有:

0:禁用标题(header)链接

1:默认值,表示只显示H2的标题

2:最大值,同时提取H2和H3的标题值

3、配置链接是,READEME.md文件时,不用写READEME的名称,只需要写到它所在的目录即可,但是其他不叫READEME的文档,需要写对应的文件名称

// 1、 docs/myword/READEME.md   写成  '/myword/'
// 2、docs/myword/First.md      写成  '/myword/First/'

4、vuepress中tip warning danger 和 markdown中的块引用,两个看起来只是颜色背景不同,但是在使用的写法上是不一样的。

5、

 

 

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值