带你跳过各种坑,一次性把 Hexo 博客部署到自己的服务器

9,182 阅读5分钟

hexo-to-your-server

原文地址:带你跳过各种坑,一次性把 Hexo 博客部署到自己的服务器

完成效果:点击查看个人网站

一、开始

配置本地 node 环境

  1. node下载 官网下载,可以的话推荐使用 nvm 安装

  2. 安装记得把目录改到其他盘,这里我具体是在 D:\programming\nodejs

node更换路径

打开cmd查看node安装情况

node -v
npm -v
  1. 配置全局环境

进入安装目录,创建文件夹node_globalnode_cache 并执行

npm config set prefix "D:\programming\nodejs\node_global"
npm config set cache "D:\programming\nodejs\node_cache"

环境配置:新增环境变量NODE_PATH和添加Path,两个值都为 D:\programming\nodejs\node_global

node更换路径

node更换路径

  1. 安装hexo-cli
npm i hexo-cli -g
hexo

如果显示下面情况,恭喜你成功全局模块调用

node更换路径

  1. 如果出现命令未找到,或不是可执行程序,别着急!先仔细重复 3-4 步,一般是能够给解决的,如果实在是不能解决,往后看

  2. 随便找个地方初始化文件,执行如下命令:

mkdir hexo-blog
cd hexo-blog && npm init -y

现在有 3 种解决方法,任选其一

  • 法 1:检查全局目录是否的hexo模块,执行如下命令:
D:\programming\nodejs\node_global\hexo
  • 法 2:如果觉得每次加前缀麻烦,使用link命令链接
npm link hexo

package.json 中新建脚本如下

npm run hexo

新建npm脚本

  • 法 3:你还可以直接在hexo-blog中下载
npm i hexo-cli
npm run hexo (还是要在package.json中新建脚本)

初始化hexo项目

  1. 如果是按照上一节步骤 4 过来的,则在hexo-blog文件下初始化
hexo init myblog && cd myblog
npm i
  1. 下载主题
git clone https://github.com/iissnan/hexo-theme-next themes/next

本地配置文件中设置theme属性

添加next主题

  1. 本地执行hexo项目,添加start脚本
npm start

新建npm-start脚本

打开 http://localhost:4000 验证效果吧

git环境搭建

  1. git安装:官网下载

  2. 生成ssh认证,执行如下命令

git config --global user.name "yourname"
git config --global user.email youremail@example.com
ssh-keygen -t rsa -C "youremail@example.com"
git config --global core.autocrlf false  // 禁用自动转换,这个不设置后面上传时会出现警告,如下

git警告

最后获取到的ssh认证在C:\Users\yourname\.ssh


三、服务器配置

搭建远程Git私库

  1. 登录到远程服务器,推荐使用Xshell 5

  2. 安装 git

git --version // 如无,则安装
yum install curl-devel expat-devel gettext-devel openssl-devel zlib-devel perl-devel
yum install -y git
  1. 创建用户并配置其仓库
useradd git
passwd git // 设置密码
su git // 这步很重要,不切换用户后面会很麻烦
cd /home/git/
mkdir -p projects/blog // 项目存在的真实目录
mkdir repos && cd repos
git init --bare blog.git // 创建一个裸露的仓库
cd blog.git/hooks
vi post-receive // 创建 hook 钩子函数,输入了内容如下
#!/bin/sh
git --work-tree=/home/git/projects/blog --git-dir=/home/git/repos/blog.git checkout -f

添加完毕后修改权限

chmod +x post-receive
exit // 退出到 root 登录
chown -R git:git /home/git/repos/blog.git // 添加权限
  1. 测试git仓库是否可用,另找空白文件夹
git clone git@server_ip:/home/git/repos/blog.git

如果能把空仓库拉下来,就说明 git 仓库搭建成功了

git仓库测试

  1. 建立ssh信任关系,在本地电脑
ssh-copy-id -i C:/Users/yourname/.ssh/id_rsa.pub git@server_ip
ssh git@server_ip // 测试能否登录

:此时的 ssh 登录 git 用户不需要密码!否则就有错,请仔细重复步骤 3-5

  1. 为了安全起见禁用 git 用户的 shell 登录权限,从而只能用 git clone,git push 等登录
cat /etc/shells // 查看 git-shell 是否在登录方式里面
which git-shell // 查看是否安装
vi /etc/shells
添加上2步显示出来的路劲,通常在 /usr/bin/git-shell

修改/etc/passwd中的权限

// 将原来的
git:x:1000:1000::/home/git:/bin/bash

// 修改为
git:x:1000:1000:,,,:/home/git:/usr/bin/git-shell

搭建nginx服务器

  1. 下载并安装nginx
cd /usr/local/src
wget http://nginx.org/download/nginx-1.15.2.tar.gz
tar xzvf nginx-1.15.2.tar.gz
cd nginx-1.15.2
./configure // 如果后面还想要配置 SSL 协议,就执行后面一句!
./configure --prefix=/usr/local/nginx --with-http_stub_status_module --with-http_ssl_module --with-file-aio --with-http_realip_module
make && make install
alias nginx='/usr/local/nginx/sbin/nginx' // 为 nginx 取别名,后面可直接用
  1. 配置nginx文件

先启动是否安装成功

nginx // 直接来!浏览器查看 server_ip,默认是 80 端口

修改配置文件

nginx -s stop // 先停止nginx
cd /usr/local/nginx/conf
vi nginx.conf
修改 root 解析路径,如下图
同时将 user 改为 root 如下图,不然nginx无法访问 /home/git/project/blog
nginx -s reload

修改nginx配置

修改nginx user

四、发布

至此我们就把本地和服务器的环境全部搭建完成,现在利用 hexo 配置文件进行链接

配置_config.yml文件

  1. 编辑 _config.yml 的 deploy 属性

编辑本地deploy

  1. 在 package.json 中添加 npm 脚本
"scripts": {
  "deploy": "hexo clean && hexo g -d",
  "start": "hexo clean && hexo g && hexo s"
},
  1. 链接!这下在本地调试就用npm start,调试好了就上传到服务器,美滋滋~快通过你的服务器 ip 访问吧
npm run deploy

五、最后说句

本人前端新手一枚,有错误的话欢迎指正

贴上 个人网站,建站初期,欢迎您的光临~

喜欢的话麻烦给个 ★ 哦

六、参考链接