渊澄YC

川流不息，渊澄取映

发表于 分类于 本文字数： 278 阅读时长 ≈ 1 分钟

HEXO默认是不带评论系统的，但后台支持调用许多第三方的评论系统，我们这里以Valine为例来给HEXO站点配置第三方评论系统

1.注册LeanCloud账户并创建应用

进入LeanCloud网站注册账户，进行实名认证，然后创建一个应用，命名为hexo。

2.获取应用的APP KEY

进入创建好的应用，点击”设置”，然后”应用凭证”，获取APPID和APPKEY。

3.编辑主题配置文件

编辑主题的_config.yml配置文件

1
2
3
4
5
6
7
8
9
10
comments:
  use: Valine
valine:
  appId: 
  appKey: 
  avatar: monsterid # gravatar style https://valine.js.org/#/avatar
  serverURLs: # This configuration is suitable for domestic custom domain name users, overseas version will be automatically detected (no need to manually fill in)
  bg: # valine background
  visitor: false
  option:

use字段填入”Valine”
appid和appkey字段填入获取到的信息，然后保存文件。

3.添加安全域名

进入应用”设置”-“安全中心”，填入你的HEXO站点地址，然后保存。

4.编译站点并发布

经过上面步骤之后对站点进行重新编译和发布，就可以在文章结尾看到评论窗口了。

发表于 分类于 本文字数： 130 阅读时长 ≈ 1 分钟

下载安装Microsoft Visual Studio Code安装包（以下简称VScode）

下载地址：

1
https://code.visualstudio.com/

设置显示语言为中文

软件安装完成之后默认语言是英文，我们在主界面同时按下ctrl+shift+P三个按键，输入configure display language，点击安装其他语言，然后下载安装简体中文包，安装完成之后即可启用切换到中文界面。

新建MarkDown格式文件

新建文件，格式选择MarkDwon即可创建MarkDwon格式的文件。

发表于 分类于 本文字数： 1k 阅读时长 ≈ 4 分钟

经过上一篇的步骤之后，我们已经可以将我们的HEXO站点发布到GitHub上了，并且可以正常访问。但是我们每次更新文章以及站点配置的时候必须先在本地进行编译、然后再部署到GitHub上，也就是每进行一次修改，必须执行以下命令

1
2
3
hexo g
hexo clean
hexo d

那有没有一种方法就是，系统检测到我们发布了新文章，然后自动进行程序的编译和发布呢？
今天部署的这个GitHub Action服务就是解决这个问题的。在上一篇文章中我们在 GitHub上还新建了一个私人仓库，我们今天用这个私人仓库来进行操作。

1.修改本地文件

删除主题文件夹下隐藏的.git文件夹

删除hexo根目录下的.deploy_git文件夹

这两个是我踩过的坑，因为主题文件和hexo deploy git工具是git clone到本地的，所以如果直接上传到GitHub仓库的话，只会上传一个空的指针文件夹，之后进行自动化编译的时候会报错，所以必须删除本地的.git相关信息。

2.将本地HEXO源文件推送到私人仓库

在hexo文件夹中初始化hexo

1
2
hexo init
git init

关联远程仓库

1
git remote add origin git@github.com:miaoyanginfo/hexo-action.git

和远程仓库进行一个同步

1
git pull --rebase origin main

将本地文件添加到暂存库

1
git add .

添加注释

1
git commit -m "init repo"

推送到GitHub私人仓库

1
git push -u origin main

如果一切顺利的话，我们就会在GitHub的私人仓库中看到我们PUSH上去的HEXO文件夹和文件。

3.生成并部署deploy公钥和密钥

定位到本地hexo文件夹运行以下命令创建deploy key:

1
ssh-keygen -f github-deploy-key -C "HEXO CD"

运行完成之后会在hexo根目录下生成github-deploy-key和github-deploy-key.pub两个文件，一个私钥，一个公钥。
进入github我们创建的私人仓库，settings-secrets添加actions secrets。
名字输入 SSH_PRIVATE
value输入生成的github-deploy-key内容，也就是私钥的内容。

进入github我们创建的公开仓库，找到settings-deploy keys，
名字输入 HEXO_DEPLOY_PUB
内容输入github-deploy-key.pub文件内的所有内容，也就是公钥的内容。

4.创建GitHub Action文件

进入GitHub私人仓库页面，切换到Actions选项，创建一个名为deploy.yml的文件，内容复制下面：

1
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
name: Deploy                      # Actions 显示的名字，随意设置
on: [push]                        # 监听到 push 事件后触发
jobs:
  build:
    runs-on: ubuntu-latest
    steps:
    - name: Checkout              # 拉取当前执行 Actions 仓库的指定分支
      uses: actions/checkout@v2
      with:
        ref: main                 # 注意选择私人仓库是main还是master分支

    - name: Setup Node            # 使用node 14
      uses: actions/setup-node@v2
      with:
        node-version: "14"

    - name: NPM INSTALL           #安装依赖
      run: |
        npm install hexo-cli -g
        npm install hexo-deployer-git  --save 
        npm install

    - name: Add KEY               #这里需要提供一个ssh私钥，用你平时常用机器里的 ~/.ssh/id_rsa即可
      env:
        SSH_PRIVATE: ${{ secrets.SSH_PRIVATE }}
      run: |
        mkdir -p ~/.ssh/
        echo "$SSH_PRIVATE" > ~/.ssh/id_rsa
        chmod 700 -R ~/.ssh
        ssh-keyscan github.com >> ~/.ssh/known_hosts
        git config --global user.email "paulmiao@me.com"
        git config --global user.name "miaoyanginfo"

    - name: Hexo Deploy           # hexo deploy 会自动build然后上传到github.io项目中
      run: |
        hexo clean
        hexo deploy

5.测试Action是否正常运行

我们现在私人仓库/source/_posts文件夹下新建一个.md的日志文件，然后切换到Actions选项卡看下自动化执行过程是否有报错，如果运行正常的话，我们进入公开仓库，看下文件的最后修改时间是不是最近几秒钟内。
然后我们再打开我们的github站点地址，看看是不是有新日志已经发布了。

总结

经过两篇文章的操作，我们已经可以实现HEXO在GitHub上面的部署以及使用GitHub的Action功能来实现文章发布时自动编译和部署。如果在部署过程中遇到问题，欢迎和我交流。

发表于 分类于 本文字数： 1.1k 阅读时长 ≈ 4 分钟


经过三天的不断网上趴文和自我修炼，参考了众多网上大神的教程和文章，自己又填了无数个坑之后，终于成功在GitHub上部署了HEXO系统发布文章，使用GitHub Action功能自动编译HEXO程序并发布静态页面。我将用两个篇幅来记录部署过程。
第一部分介绍如何在本地部署HEXO程序，安装主题，本地预览，然后发布到Github Page。
第二部分介绍如何使用GitHub Action功能实现HEXO程序的自动编译和发布。

1.GitHub上新建仓库

登录你的Github，新建两个仓库：
一个仓库用于发布我们的HEXO站点，为了便于区分，我们在这里叫它公开仓库，新建的时候选在类型为Public，网址那里填入***.github.io，确保你可以使用域名https://***.github.com 访问到你的页面，这篇文章我们主要在这个仓库中进行操作；
另一个站点用于存放我们的HEXO程序源文件，用于和主仓库实现自动化编译和发布的联动，我们叫它私人仓库，类型选择Pravite，名称随便起，我们这里叫做hexo-action。

2.本地安装配置环境

需要安装的工具有git和node两个环境，安装包已经上传到了阿里云，大家可以自行下载。
git x64

1
https://www.aliyundrive.com/s/eWkiy8beBEj

node x64

1
https://www.aliyundrive.com/s/A6iLQPNecXt

安装完成之后在cmd窗口运行git –version及node -v 命令确保安装正确。

3.部署Github通讯密钥

我们在本地运行git bash命令窗，

1
2
git config --global user.name "你的GitHub用户名"
git config --global user.email "你的GitHub注册邮箱"

生成ssh密钥文件: 

1
ssh-keygen -t rsa -C "你的GitHub注册邮箱"

连续回车，直到命令运行结束。
在本地用户名文件夹下会看到一个.ssh命名的文件夹，用记事本或是notepad++打开里面的id_rsa.pub文件并复制全部内容。
打开GitHub_Settings_keys 页面，新建new SSH Key，Title随便填，Key那里把刚才复制的公钥粘贴过去，然后点击Add SSH Key。

我们可以输入下面命令来测试一下密钥是否配置正确：

1
ssh git@github.com

3.运行安装命令进行HEXO的安装

在本地选择一个文件夹，作为你的hexo主目录，在这个文件夹下右键，选择git bash here打开git命令窗口。

运行命令安装hexo：

1
npm install -g hexo

运行命令在此文件夹新建站点：

1
hexo init

如果命令没有报错的话，在你选定的文件夹下应该会下载到hexo的文件。

我们可以编辑根目录下的_config.yml来配置HEXO站点的相关信息。
编辑完相关信息之后运行以下命令重新生成站点文件：

1
hexo g

4.打开本地演示模式

输入下面命令打开本地演示模式：

1
hexo s

打开之后在浏览器输入http://localhost:400 就可以访问到网站了。

5.安装主题butterfly

我们接下来安装一个主题，这里以butterfly这个主题为例，其他主题的安装也类似。

在hexo文件下下运行以下命令：

1
2
git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly
npm install hexo-renderer-pug hexo-renderer-stylus --save

运行完成之后我们编辑主题文件夹下的_config.yml文件来对主题进行配置。
编辑完成之后复制一份这个yml文件到hexo根目录，并命名为_config.butterfly.yml。
接着编辑根目录下面的站点配置文件_config.yml来更改主题

1
theme: butterfly

修改完成之后重新运行下面命令编译HEXO：

1
hexo g

然后本地预览新安装的主题：

1
hexo s

6.将站点发布到Github上

如果在本地演示没有报错，我们就可以将站点发布到Github上面了。
首先我们需要编辑根目录下的_config.yml文件，拉到文件最底部填入你的github地址：

1
2
3
4
5
deploy:
  type: 'git'
  repo: git@github.com:miaoyanginfo/miaoyanginfo.github.io.git
  branch: master

然后运行下面的命令：

1
2
npm install hexo-deployer-git  --save
hexo clean && hexo g && hexo d

发布完成之后我们直接用域名https://***.github.io
就可以访问到我们搭建的HEXO站点了。