1、vuepress新手入门课程(一)
1-1、vuepress简介与安装
-
node -v
-
npm config set registry=http://registry.npm.taobao.org
-
npm config list
-
npm install -g yarn
安装yarn -
npm init
-
npm add -D vuepress
-
mkdir docs && echo '# Hello VuePress' > docs/README.md
-
{ "name": "mao2022", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "author": "", "license": "ISC", "devDependencies": { "vuepress": "^1.8.2" }, "scripts": { "docs:dev": "vuepress dev docs", "docs:build": "vuepress build docs" } }
-
npm run docs:dev
1-2、目录配置
module.exports={
title:"mao2022",
description:"学习vuepress",
head:[
['link',{rel:"icon",href:"./logo.jpg"}]
]
}
1-3、主题配置01
module.exports={
title:"mao2022",
description:"学习vuepress",
head:[
['link',{rel:"icon",href:"./logo.png"}]
],
themeConfig:{
logo:"./logo.png",
nav:[
{text:'首页','link':'/'},
{text:'前端','link':'/front/'},
{text:'后端','link':'/after/'},
{text:'CSDN','link':'https://blog.csdn.net/weixin_42148729'},
]
}
}
1-4、主题配置02
module.exports={
title:"mao2022",
description:"学习vuepress",
head:[
['link',{rel:"icon",href:"./logo.png"}]
],
themeConfig:{
logo:"./logo.png",
navbar: true,
nav:[
{text:'首页','link':'/'},
{text:'前端','link':'/front/',items:[
{text:'Vuepress','link':'/vuepress/'},
{text:'HTML','link':'/html/'},
{text:'CSS','link':'/css/'},
]},
{text:'后端','link':'/after/',items:[
{
text:'理论知识',
items:[
{text:'PHP','link':'/php/'},
{text:'PHP插件','link':'/phplib/'}
]
},{
text:'框架',
items:[
{text:'ThinkPHP','link':'/thinkphp/'},
{text:'Laravel','link':'/laravel/'}
]
}
]},
{text:'CSDN','link':'https://blog.csdn.net/weixin_42148729'},
],
sidebar:[
['/','首页'],
{
title:'前端',
path:'/front/',
children:[
['/vuepress/','Vuepress'],
['/html/','HTML'],
['/css/','CSS']
]
},
]
},
}
第2章 vuepress新手入门课程(二)
2-1、markdown语法01
2-2、markdown语法02
ID | name
:-- | :-:
1 | bob
2-3、markdown拓展
1、自定义容器
2、```html {9}
3、emoji表情
:1234:
:100: