经过踩坑+出坑，一系列循环，总算初步把博客网站建立起来了，因为遇到的坑太多了，所以记下来，怕忘了……各种参考地址在最后~

建站原理

本地搭建hexo的开发环境（node.js、git、npm)，然后修改配置参数，本地生成网页git push到相应的github 仓库或者远程的vps服务器上，github page就不说了，傻瓜式操作， vps端是用的阿里的轻应用服务器（ubuntu 16.04 x64)+nginx，其中nginx的源代码编译遇到了一些坑…… 0—0

搭建本地环境

我用的是windows操作系统，实际上linux或者mac知道了原理后也都大同小异了。

前提准备

需要的安装包如下：

• node.js (带npm)
• git环境（网上很简单都可以找到）
• Termius (跨设备的ssh客户端非常好用哦)
• sublime (一个很好用的文本编辑器)
• 下载地址：链接：https://pan.baidu.com/s/1HsxmeSwMqCdBI5v23JsK3w 提取码：rkl4

安装相应的安装包

需要注意的是都按照默认选项安装就可以了。其中git安装完需在shell中执行：

bash
git config --global user.name "yourname"
git config --global user.email "yourmail"

安装完node.js之后请执行如下命令检查可否运行：

bash
node -v
npm -v

如果一直卡住了，那么请检查 c:\user\ {你的账户}文件夹里有没有.npmrc文件，有的话删了就正常了

安装hexo

打开powershell，执行命令：

bash
npm install hexo-cli -g
hexo

看看是不是安装成功了呢 如果安装的时候出现了两个警告，什么fsevents之类的，不用在意。

初始化hexo文件夹

找个文件夹初始化你的博客吧~，下面博客路径用blog-path来替代。 在你找到的文件夹下，执行：

bash
mkdir hexo-blog
cd hexo-blog
npm init
hexo init myblog
cd myblog
npm install

执行本地的hexo项目

修改myblog下的package.json，在scripts下面仿照上面的格式加入下面两个脚本（记得上面的逗号）

验证成果

在myblog下执行：

bash
npm start

在浏览器打开localhost:4000看一下效果吧~

本地hexo的简单配置

修改myblog下的_config.yml即可，详细内容看官方文档吧~

• 官方文档

修改完了保存，然后执行npm start即可在本地看到效果咯 至此，本地部署完成~

github端设置（如果你用的话）

注册github账号

直接去 github官网 注册就好了嘛

建立仓库，设置个人主页

登录之后点击New repository建立自己的仓库，仓库的名称请按照yourname.github.io来命名，并勾选README的那个选项 进入仓库，点设置找到github pages，看到your site is published at https://yourname.github.io/就证明你的个人主页创建完成了 接下来选择主题，随便选一个（反正一会咱们上传咱们的hexo生成的，和他没关系）

服务器端设置

初始化服务器的git环境

在服务器中 1.安装git，例如我的ubuntu，直接apt-get install git即可 2.创建用户并配置其仓库，执行如下命令

bash
useradd git
passwd git //设置密码
mkdir /home/git //创建git的目录
chown git:git /home/git //设置权限
su git   //切换用户
cd /home/git
mkdir -p progects/blog  //创建项目的目录
mkdir repos && cd repos //创建仓库的目录
git init --bare blog.git //创建仓库
vim ./blog.git/hooks/post-receive //用vim创建钩子函数，不会vim的请百度一下

文件内容如下：

bash
#!/bin/sh
git --work--tree=/home/git/projects/blog --git-dir=/home/git/repos/blog.git checkout -f

修改其权限，执行：

bash
chmod +x ./blog.git/hooks/post-receive //添加执行权限
exit //回到root
chown -R git:git /home/git/repos/blog.git //添加权限
···
3.可以在本地电脑找个空文件夹测试一下`git仓库`是不是能用，执行：

```bash
git clone git@server_ip:/home/git/repos/blog.git

如果成功把空的仓库拉下来，就证明git仓库创建成功了

nginx网页服务器搭建

推荐直接编译源码

编译源码

执行：

bash
cd /ure/local/src
wget http://nginx.org/download/nginx-1.15.2.tar.gz
tar -zxvf nginx-1.15.2.tar.gz
cd nginx-1.15.2
./configure //生成配置文件，如果像加上ssl协议就执行后面那一句
./configure --prefix=/usr/local/nginx --with-heep_stub_status_module --with-http_ssl_module --with-file-aio --with-heep_realip_module //ssl就是https访问
make
make install
alias nginx='/usr/local/nginx/sbin/nginx' //别名，但是重启无效

错误处理 编译源码很容易出岔子，最常见的如下： 1.缺少pcre库，解决办法：

bash
apt-get libpcre3 libpcre3-dev

2.缺少openssl

bash
apt-get install openssl libssl-dev

3.缺少zlib

bash
apt-get install zlib1g-dev

其余少啥装啥，apt-get找不到，就去下载编译源码~慢慢来可以解决的

nginx参数设置

通过编辑/usr/local/nginx/conf/nginx.conf文件来修改： 如下图，修改根目录为刚才咱们设置的项目目录，并把一开始的用户设置成root，其余的参数如想修改，查阅资料即可 如果你想绑定域名，就在第二个划线处输入你的网址就行

测试

bash
nginx
nginx -s reload

然后在本地电脑的浏览器上打开你的服务器ip吧~ 看看能不能出现nginx的欢迎界面~

ssh信任关系建立

咱们走ssh协议通过git把本地hexo生成的网页推到服务器或者github上的，但是每次都输入密码很麻烦啊~，所以咱们通过ssh密钥来建立信任关系， 这样子就不用每次都输入密码了~ 本地电脑中 在powershell里执行：

bash
ssh-keygen -t rsa -C "youremail"

然后输入不输入密码都行，我是直接按回车了 之后你生成的密钥就会保存在了你的用户目录\.ssh\目录下面，id_rsa是私钥，id_rsa.pub是公钥 私钥就在咱们电脑上，公钥可以放到github或者vps上哦，放上去就可以不用密码直接访问了

拷贝公钥到服务器

本地电脑中*

bash
ssh-copy-id -i C:\Users\yourname\.ssh\id_rsa.pub git@server_ip
ssh git@server_ip //测试是不是能登陆

此时应该不需要密码就能登陆，如果不行请查找原因，或者手动拷贝公钥到服务器git用户的.ssh目录下,chmod 600并改名为authorized_keys即可 此时服务器的环境就彻底ok了

把公钥放到github上

登录github，选择右上角用户头像下的setthings,找到SSH and GPG keys,添加你的公钥，直接复制过去就行了，名字随便起~ 然后可以在本地测试一下

bash
ssh git@github.com

如果不用密码，并出现了hello yourname字样，证明ok，至此github的配置也完成了

部署本地的网页到服务器 or github上

修改hexo配置

修改本地的myblog/_comfig.yml里面的deploy字段下面的内容如图，把cs3cx4g换成你的名字就行了，如果你想同时推送到服务器和github上，就把途中#注释的那个也加上换成你的服务器的ip地址就行了嘛 哦，对了，别用记事本，用sublime~

安装git部署插件

在本地的myblog下执行

bash
npm install --save hexo-deployer-git

部署测试

在本地myblog下执行

bash
npm run start  //咱们那个之前添加过的脚本哦

然后打开你的服务器或者github地址看看吧~，是不是网页在上面了呢

next主题配置

具体参见本站的next主题优化

博客的配置和使用

具体参见本站的hexo博客简单配置和使用

markdown基本语法

具体参见本站的markdown在hexo中的基本语法

参考文章

• 带你跳过各种坑，一次性把hexo部署到服务器上
• next主题官方文档
• hexo的官方文档