Vuepress + git(静态站点托管)此处我们把 blog 目录作为 targetDir （参考命令行接口），下

快速开始

步骤1：搭建VuePress博客

yarn create vuepress [blogName]

# And answer the following questions in CLI, for instance:

# ? Select the boilerplate type blog

# ? What's the name of your project? blog

# ? What's the description of your project? Billyyyyy3320's personal website

# ? What's your email? newsbielt703@gmail.com

# ? What's your name? Billy Chin

# ? What's the repo of your project. https://github.com/newsbielt703/Billy

cd [blogName] && yarn

步骤2：开发和构建

# Run localhost
yarn dev

# Build your VP blog
yarn build

VuePress开发服务器在监听http://localhost:8080/**，而内置文件将在**.vuepress/dist

目录结构

默认的页面路由

此处我们把 blog 目录作为 targetDir （参考命令行接口），下面所有的“文件的相对路径”都是相对于 blog 目录的。在项目根目录下的 package.json 中添加 scripts ：

基本配置

一个 VuePress 网站必要的配置文件是 .vuepress/config.js，它应该导出一个 JavaScript 对象：

产生内容

该 ** _posts ** 文件夹是您博客文章所在的位置。您可以简单地在Markdown中撰写博客文章。所有博客文章文件都可以从头开始。仅title是必需的，但我们建议您如下定义所有前题变量。它们将用于设置相应的布局。查阅frontmatter了解更多详细信息。

部署到github

github 首先创建一个仓库， USERNAME.github.io，其中 username必须是你的github账户名
再次创建一个仓库，这个仓库名任意即可，接着你可以把这个仓库克隆到本地，把之前上面的代码放在clone后的文件夹中，或者可以绑定到已有仓库：
- git init
- git remote add origin https://自己的仓库url地址
- git add .
- git commit -m '注释语句'
- git push -u origin master
在仓库二根目录下创建一个如下的 deploy.sh 文件（请自行判断去掉高亮行的注释）:

#!/usr/bin/env sh

# 确保脚本抛出遇到的错误
set -e

# 生成静态文件
npm run docs:build // 我们配的scripts shi 'build'

# 进入生成的文件夹
cd docs/.vuepress/dist //我们这里是blog

# 如果是发布到自定义域名
# echo 'www.example.com' > CNAME

git init
git add -A
git commit -m 'deploy'

# 如果发布到 https://<USERNAME>.github.io
# git push -f git@github.com:<USERNAME>/<USERNAME>.github.io.git master

# 如果发布到 https://<USERNAME>.github.io/<REPO>
# git push -f git@github.com:<USERNAME>/<REPO>.git master:gh-pages

cd -

在 docs/.vuepress/config.js 中设置正确的 base。
- 如果你打算发布到 https://<USERNAME or GROUP>.github.io/，则可以省略这一步，因为 base 默认即是 "/"。
- 如果你打算发布到 https://<USERNAME or GROUP>.github.io/<REPO>/（也就是说你的仓库在https://github.com/<USERNAME>/<REPO>），则将 base 设置为 "/<REPO>/"。

访问

最后可以通过 https://usename.github.io(发布到 https://<USERNAME or GROUP>.github.io/) 或者 https://USERNAME.github.io/REPO（发布到https://github.com/<USERNAME>/<REPO>）访问到

解析到自己域名

如果你想解析到自己的域名，你可以通过添加如下解析记录然后进入到https://usename.github.io，点击 ** settings **，在相应位置上绑定域名即可