lisang
/
vuepress-theme-vdoing
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

init

This commit is contained in:
xugaoyi 2019-12-06 17:22:21 +08:00
parent 1ab92494ee
commit 3541bd6351
1 changed files with 32 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

77
README.MD
View File

@ -2,30 +2,22 @@
## 介绍 ## 介绍
使用 VuePress 创建 SEO 友好的静态博客站。一键发布到 GitHub Pages，内置 GitHub Action 自动部署脚本。 使用 [VuePress](https://v1.vuepress.vuejs.org/zh/guide/) 创建 SEO 友好的静态博客站。一键发布到 GitHub Pages，内置 [GitHub Action](https://github.com/features/actions) 自动部署脚本。
**您不需要在本地进行打包，只需要把代码push到GitHub，Action将自动为您打包和部署。** **您不需要在本地进行打包，只需要把代码push到GitHub，Action将自动为您打包和部署。**
VuePress 是一款使用 Vue 驱动的静态网站生成器，通过一定的配置之后，为每一个 md 文件生成静态 html，并通过主题挂接起来。用来写文档是非常不错的，写博客就要做一点工作。
## 相关技术
[VuePress](https://v1.vuepress.vuejs.org/zh/guide/)
[Github Aciton](https://github.com/features/actions)
## 使用 ## 使用
1. ##### 克隆项目后进入 #### 1、克隆项目后进入
```bash ```bash
git clone https://github.com/xugaoyi/evanblog git clone https://github.com/xugaoyi/evanblog
cd evanblog cd evanblog
``` ```
2. ##### 安装依赖并运行开发服务 #### 2、安装依赖并运行开发服务
> 使用yarn的可以把以下`npm run`命令替换为`yarn` > 使用yarn的可以把以下`npm run`命令替换为`yarn`
@ -34,43 +26,40 @@ npm install # or yarn install
npm run dev npm run dev
``` ```
3. ##### 编辑 #### 3、编辑
编辑或新增\*.md，以及修改 docs/.vuepress/config.js 中的 nav 导航栏等信息。具体可查看上面的 vuepress 文档，重新运行`npm run dev`并 ctrl+f5 刷新浏览器查看更改。 编辑或新增\*.md，以及修改 docs/.vuepress/config.js 中的 nav 导航栏等信息。具体可查看上面的 vuepress 文档，重新运行`npm run dev`并 ctrl+f5 刷新浏览器查看更改。
4. ##### 打包和部署 #### 4、打包和部署
* **手动打包和部署** * **手动打包和部署**
```bash
npm run list # 将文章栏目下三个文件夹中的文件加入侧边栏（文章索引）
npm run built # 打包
# 把打包好的代码提交到github仓库，并设置github pages
```
```bash
npm run list # 将文章栏目下三个文件夹中的文件加入侧边栏（文章索引）
npm run built # 打包
# 把打包好的代码提交到github仓库，并设置github pages
```
* **或利用GitHub Action自动持续集成（推荐）** * **或利用GitHub Action自动持续集成（推荐）**
第一步，这个项目需要将构建成果发到 GitHub 仓库，因此需要 GitHub 密钥。按照[官方文档](https://help.github.com/en/articles/creating-a-personal-access-token-for-the-command-line)，生成一个密钥。 第一步，这个项目需要将构建成果发到 GitHub 仓库，因此需要 GitHub 密钥。按照[官方文档](https://help.github.com/en/articles/creating-a-personal-access-token-for-the-command-line)，生成一个密钥。
第二步，将这个密钥储存到当前仓库的`Settings/Secrets`里面。 第二步，将这个密钥储存到当前仓库的`Settings/Secrets`里面。
`Settings/Secrets`是储存秘密的环境变量的地方。环境变量的名字可以随便起，这里用的是`ACCESS_TOKEN`。如果你不用这个名字，后面脚本里的变量名也要跟着改。
`Settings/Secrets`是储存秘密的环境变量的地方。环境变量的名字可以随便起，这里用的是`ACCESS_TOKEN`。如果你不用这个名字，后面脚本里的变量名也要跟着改。
第三步，设置GitHub Pages为gh-pages分支。
第三步，设置GitHub Pages为gh-pages分支。
因为本项目已经内置 GitHub Action 自动部署脚本，您只需要 push 代码到github， 因为本项目已经内置 GitHub Action 自动部署脚本`.github/workflows/ci.yml` ，您不需要在本地进行打包，只需要 push 代码到github，Action将自动为您打包和部署。
，CI 脚本将自动为您打包和部署。 参考 [教程](http://www.ruanyifeng.com/blog/2019/09/getting-started-with-github-actions.html)
参考 [教程](http://www.ruanyifeng.com/blog/2019/09/getting-started-with-github-actions.html)
> 注意：您需要在package.json中修改`/evanblog/`为自己的项目名。
>
> 如果您有自定义域名，一并修改`www.evanblogweb.com`为你的域名。
> 注意：您需要在package.json中修改`/evanblog/`为自己的项目名。
>
> 如果您有自定义域名，一并修改`www.evanblogweb.com`为你的域名。
@ -107,7 +96,7 @@ npm run dev
// 域名替换成你的 // 域名替换成你的
``` ```
在自动部署配置文件ci.yml中jobs.build.steps.<Build and Deploy\>.env.BUILD_SCRIPT添加脚本 在自动部署配置文件ci.yml的jobs.build.steps.<Build and Deploy\>.env.BUILD_SCRIPT中添加脚本
```sh ```sh
npm run chame:gitpage npm run chame:gitpage
@ -116,8 +105,6 @@ npm run chame:gitpage
## 提示 ## 提示
#### 注意 yaml #### 注意 yaml