利用 Hexo 搭建个人博客（三）安装

发表于 分类于 本文字数： 1.3k 阅读时长 ≈ 5 分钟
本地环境和 VPS 上 Hexo 的安装过程说明

本地环境

安装命令

  1. npm install hexo-cli -g 安装 Hexo 命令行工具。
  2. 生成本地项目。
    • hexo init blog 创建名为 blog 目录。
    • cd blog 切换到 blog 目录。
    • npm install 安装 Hexo 依赖
    • hexo server 或者 hexo s 打开 localhost:4000 测试是否成功。
  3. 新建文章测试。
    • hexo new post "文章标题" 省略 post 也可以
    • 先 hexo g 后 hexo s 再在浏览器内打开 localhost:4000 就可见到新文章。

基本结构

_config.yml

站点配置文件，在该文件内修改网站设置。

参数 描述
title 标题
subtitle 副标题
description 网站描述
author 名字
language 网站使用的语言
timezone 时区
  • title、subtitle、subtitle、description、author 请自行修改
  • language: 属性值修改为 zh-Hans
  • timezone: 属性值修改为 Asia/Shanghai

其余配置暂时别修改。

source

资源文件夹，用于存放用户资源。所有文章会以 .md 格式保存在 _post 文件夹内。其余 _ 开头的文件夹会被忽略。

themes

主题文件夹，下载你喜欢的主题至此文件夹下。

常见命令

  • hexo init [folder] 新建网站
  • hexo new [layout] <title> 创建文章
    • [layout] 常用值为 post ，即创建新文章；draft 创建草稿。
    • 省略 [layout] 属性则默认使用 _config.yml 下的 default_layout 属性。
  • hexo generate 或 hexo g 生成静态文件。
  • hexo server 或 hexo s 启动服务器。
  • hexo clean 清除缓存文件 ( db.jason )和生成的静态文件 ( public )
  • npm uninstall hexo-cli 卸载 hexo

远程仓库

这里借助码云来托管代码。

登陆码云，创建一个私有仓库,取名为“Hexo-Blog”，在管理-部署公钥管理中添加个人公钥。

添加个人公钥

1
2
3
4
ssh-keygen -t rsa -C "xxxxx@xxxxx.com"  

# Generating public/private rsa key pair...
# 三次回车即可生成 ssh key

查看个人公钥

1
2
cat ~/.ssh/id_rsa.pub
# ssh-rsa AAAAB3NzaC1yc2EAAAADAQABAAABAQC6eNtGpNGwstc....

添加到个人账户 - SSH 公钥中。

若添加成功，则输入 ssh -T git@git.oschina.net 会返回 Welcome to Git@OSC, yourname!

同理，在 VPS 上生成公钥，但这次要添加到 Hexo 项目仓库中，用作只读公钥。

本地文件上传至远程仓库

  1. cd blog 转到 Hexo 目录。
  2. git init
  3. git remote add origin git@gitee.com:xxxx/Hexo-Blog.git
  4. git add .
  5. git commit -m "first push"
  6. git push origin master

服务器上安装 Hexo

首先在仓库下添加服务器公钥，具体操作参考上文

把文件从仓库拉到服务器下

  1. mkdir hexo 创建 hexo 文件夹
  2. git init
  3. git remote add origin git@gitee.com:xxxx/Hexo-Blog.git
  4. git pull origin master

安装 Hexo

  1. 切换到 hexo 目录下
  2. npm install hexo-cli -g
  3. npm install
  4. hexo g （ Hexo 编译 ）

错误 npm install -g hexo-cli failed

$ sudo npm i -g hexo-cli shark@dev
[sudo] password for shark:
/usr/bin/hexo -> /usr/lib/node_modules/hexo-cli/bin/hexo

dtrace-provider@0.8.5 install /usr/lib/node_modules/hexo-cli/node_modules/dtrace-provider
node scripts/install.js

hexo-util@0.6.1 postinstall /usr/lib/node_modules/hexo-cli/node_modules/hexo-util
npm run build:highlight

hexo-util@0.6.1 build:highlight /usr/lib/node_modules/hexo-cli/node_modules/hexo-util
node scripts/build_highlight_alias.js > highlight_alias.json

sh: highlight_alias.json: Permission denied
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! hexo-util@0.6.1 build:highlight: node scripts/build_highlight_alias.js > highlight_alias.json
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the hexo-util@0.6.1 build:highlight script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

┌───────────────────────────────────────────────────┐
│ npm update check failed │
│ Try running with sudo or get access │
│ to the local update config store via │
│ sudo chown -R $USER:$(id -gn $USER) /root/.config │
└───────────────────────────────────────────────────┘
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.1.2 (node_modules/hexo-cli/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.2: wanted {“os”:”darwin”,”arch”:”any”} (current: {“os”:”linux”,”arch”:”x64”})

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! hexo-util@0.6.1 postinstall: npm run build:highlight
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the hexo-util@0.6.1 postinstall script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

解决办法一

  • $ sudo chown -R user /usr/lib/node_modules
  • $ npm i -g hexo-cli as user
  • $ sudo chown -R root /usr/lib/node_modules

解决办法二

  • # npm config set user 0
  • # npm config set unsafe-perm true
  • # npm install -g hexo

参考

配置 Nginx

  • cd /etc/nginx/conf.d 进入 nginx 配置文件目录
  • vi hexo.conf 新创建配置文件
  • 在 hexo.conf 输入以下内容，保存退出
1
2
3
4
5
6
7
8
server {
    listen          80;  # 监听端口
    server_name     xxx.com www.xxx.com;  # 你的域名
    location / {
        root        /root/hexo/public;
        index        index.html;
    }
}
  • 回到 /etc/nginx 目录下，打开 nginx.conf 文件，修改 user 得值为 root
  • nginx -s reload 重载配置文件

禁止使用 IP 访问

新建一个 .conf 文件，输入一下内容:

1
2
3
4
5
server {
  listen 80 default;
  server_name _;
  return 403;
}

WebHooks 自动部署

网页设置

配置 WebHooks ，这样每次更新完文章只需要本地 push 到仓库就可以，服务器会自动从仓库拉取更新文件，免去远程登陆服务器的麻烦。

在 WebHooks 界面添加 URL : http://yoururl.com:port/webhooks/push/123456，提交即可。 自行修改 yoururl 和 port 的值

本地设置

本地 Hexo 目录下创建 webhooks.js 文件，添加内容:

1
2
3
4
5
6
7
8
9
10
11
var http = require('http')
var exec = require('child_process').exec

http.createServer(function (req, res) {
    // 该路径与WebHooks中的路径部分需要完全匹配，实现简易的授权认证。
    if(req.url === '/webhooks/push/123456'){
        // 如果url匹配，表示认证通过，则执行 sh ./deploy.sh
        exec('sh ./deploy.sh')
    }
    res.end()
}).listen(port) //你设置的端口

接着新建 deploy.sh 文件，添加内容:

1
2
3
hexo clean
git pull origin master
hexo g

将新增加的两个文件 push 到仓库和服务器。

服务器设置

使用 PM2 管理监听服务。
在 hexo 文件夹下：
pm2 start webhooks.js

完成

到这里 Hexo 已经全部安装完毕，接下来所要做的就是调整博客主题，更新文章了。