Vuepress Docs Template
# 😚 Welcome
Welcome to the Vuepress Docs Template
# 🎮 TL;DR
# ✍ Why am I doing this?
Easy to write documents for someone.
# 🔨 Usage
# Pure Document
git clone git@github.com:Rain120/vuepress-docs-template.git
yarn install # or npm install
2
3
Deploy
We are auto deploy when you are commit by the pre-commit of the husky hooks. So you just need to add, commit, push. Etc:
git add .
git commit -m 'feat: vuepress docs template commit'
# if you need to pulls
# git pull origin master
git push origin master
2
3
4
5
6
7
提示
We can also deploy by yourself, but we also deploy it when you commit, if you want to deploy by yourself, you can modify the pre-commit of the husky hooks, remove the command with npm run deploy
.
npm run deploy
# Project Document
Let me see our template folders.
tree . -al 3 -I "node_modules|dist|images|.git|.DS_Store"
.
├── .github
│ └── ISSUE_TEMPLATE
│ ├── bug_report.md
│ ├── custom.md
│ └── feature_request.md
├── .gitignore
├── LICENSE
├── README.md
├── commitlint.config.js
├── deploy.sh # copy to your project root
├── docs # copy to your project root
│ ├── .vuepress
│ │ ├── components
│ │ │ └── MySWUpdatePopup.vue
│ │ ├── config.js
│ │ ├── enhanceApp.js
│ │ ├── public
│ │ │ ├── logo.png
│ │ │ └── manifest.json
│ │ ├── styles
│ │ │ └── index.styl
│ │ ├── theme
│ │ └── utils
│ │ ├── alias.json
│ │ ├── copy.js
│ │ ├── nav.js
│ │ ├── plugins.js
│ │ └── sidebarHelper.js
│ ├── README.md
│ └── zh
│ ├── guide
│ │ └── README.md
│ ├── how-to-config-docs
│ │ └── README.md
│ └── how-to-write-docs
│ └── README.md
├── package-lock.json
├── package.json
├── wechat-zhifubao-pay.png
└── yarn.lock
3 [error opening dir]
13 directories, 27 files
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
提示
First copy the docs folder and the deploy.sh file to your project root, and then we need to copy something in package.json. Let's do it.
{
"name": "vuepress-docs-template",
"author": "Rain120",
"repository": {
"type": "git",
"url": "git+https://github.com/Rain120/vuepress-docs-template.git"
},
"version": "1.0.0",
"description": "Awesome code implementation for Javascript",
"main": "index.js",
"scripts": {
"lint-staged": "lint-staged",
"changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0 && git add .",
"plop": "./node_modules/.bin/plop",
"docs": "npm run plop docs",
"docs:dev": "vuepress dev docs",
"docs:build": "vuepress build docs",
"deploy": "bash ./scripts/deploy.sh",
"remote": "bash ./scripts/add-remote.sh"
},
"keywords": [
"docs",
"vuepress",
"template",
"vuepress-docs",
"docs-template",
"vuepress-docs-template"
],
"license": "MIT",
"bugs": {
"url": "https://github.com/Rain120/vuepress-docs-template/issues"
},
"homepage": "https://github.com/Rain120/vuepress-docs-template#readme",
"lint-staged": {
"{src}/**/**.ts": [
"git add"
]
},
"husky": {
"hooks": {
"pre-commit": "npm run changelog && lint-staged",
"commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
}
},
"devDependencies": {
"@vuepress/plugin-back-to-top": "^1.5.3",
"@vuepress/plugin-blog": "^1.9.2",
"@vuepress/plugin-google-analytics": "^1.5.3",
"@vuepress/plugin-medium-zoom": "^1.5.3",
"@vuepress/plugin-pwa": "^1.5.3",
"conventional-changelog-cli": "^2.0.35",
"husky": "^3.0.9",
"lint-staged": "^9.4.3",
"markdown-it-imsize": "^2.0.1",
"markdown-it-katex": "^2.0.3",
"markdown-it-task-lists": "^2.1.1",
"moment": "^2.27.0",
"plop": "^2.7.4",
"vuepress": "^1.5.3",
"vuepress-plugin-awesome-gitalk": "^0.0.4",
"vuepress-plugin-container": "^2.1.4",
"vuepress-plugin-mathjax": "^1.2.8"
}
}
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
提示
Now we had seen all things about package.json. We just need devDependencies, if you had someone of devDependencies, you needn't all of that.
# devDependencies
{
"devDependencies": {
"@vuepress/plugin-back-to-top": "^1.2.0",
"@vuepress/plugin-blog": "^1.9.2",
"@vuepress/plugin-google-analytics": "^1.2.0",
"@vuepress/plugin-medium-zoom": "^1.0.0-rc.1",
"@vuepress/plugin-pwa": "^1.3.0",
"conventional-changelog-cli": "^2.0.27",
"husky": "^3.0.9",
"lint-staged": "^9.4.3",
"markdown-it-imsize": "^2.0.1",
"markdown-it-katex": "^2.0.3",
"markdown-it-task-lists": "^2.1.1",
"moment": "^2.24.0",
"vuepress": "^1.3.1",
"vuepress-plugin-awesome-gitalk": "^0.0.4"
}
}
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
提示
If you don't want to format your commit and changelog, there 3 package you can remove it. But if you need it and you have not config it, please go to husky
{
"devDependencies": {
"conventional-changelog-cli": "^2.0.27",
"husky": "^3.0.9",
"lint-staged": "^9.4.3"
}
}
2
3
4
5
6
7
# scripts
{
"scripts": {
"lint-staged": "lint-staged",
"changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0",
"docs:dev": "vuepress dev docs",
"docs:build": "vuepress build docs",
"deploy": "bash ./scripts/deploy.sh",
"remote": "bash ./scripts/add-remote.sh"
}
}
2
3
4
5
6
7
8
9
10
提示
If you don't want to format your commit and changelog, there 2 scripts you can remove it. But if you need it and you have not config it, please go to husky
{
"scripts": {
"lint-staged": "lint-staged",
"changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0"
}
}
2
3
4
5
6
# husky
{
"lint-staged": {
"{src}/**/**.ts": [
"git add"
]
},
"husky": {
"hooks": {
"pre-commit": "npm run changelog && npm run deploy && git add . && lint-staged",
"commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
}
},
}
2
3
4
5
6
7
8
9
10
11
12
13
More Config Detail Please Goto the Links.
Now you have all mine, Enjoy yourself!! 😉😉😉
# 🤝 Contributing
We welcome all contributions. You can submit any ideas as pull requests or as a GitHub issue.
# 🔗 Links
# 👨🏭 Author
Front-End development engineer, technology stack: React + Typescript + Mobx, also used Vue + Vuex for a while
# 📝 License
Copyright © 2020-present Rain120.
# ☕ Coffee or Tea
如何配置文档? →