环境说明

npm version ：6.4.1
node version : 10.13.0

创建项目

VuePress官网有详细说明。按照我们要达到目的，先创建一个文件夹note-boot。

通过cmd命令进入note-boot，输入命令：

npm init -y

note-boot下面多了package.json文件，package.json内容为：

{
  "name": "note-book",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

设置入口

修改package.json如下：

{
  "name": "note-book",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "docs:dev": "vuepress dev docs",
    "docs:build": "vuepress build docs"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

设置依赖

修改package.json如下：

{
  "name": "note-book",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "docs:dev": "vuepress dev docs",
    "docs:build": "vuepress build docs"
  },
  "devDependencies": {
    "vuepress": "^0.14.2"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

安装依赖

输入命令：

npm install

编写首页

新建docs文件夹和README.md文件，文件夹目录如下：

|-- README.md           // readme文件
|-- docs                // 存放md文件笔记
|-- node_modules        // 依赖库
|-- package-lock.json   
`-- package.json

运行项目

输入命令：

npm run docs:dev

在浏览器访问：http://localhost:8080/

构建站点

在GitHub上面创建一个repository，名字叫做note-book

部署到gh-page

生成静态文件

通过gitbash进入note-book文件夹，输入命令：

$ npm run docs:build

这个时候bote-book的docs文件下面会多一个.vuepress的隐藏文件夹。在.vuepress的有一个dist文件夹，存放生成的静态文件，目录结构如下：

`-- dist
    |-- 404.html
    `-- assets
        |-- css
        |-- img
        `-- js

进入生成的文件夹

$ cd docs/.vuepress/dist/

提交到GitHub

# 初始化
$ git init
# 添加全部文件
$ git add -A
# 提交
$ git commit -m 'note-book初始化'
# 推送到github
$ git push -f [email protected]:chisijun/note-book.git master:gh-pages