使用hexo搭建博客并部署到云服务器

前言

基于hexo搭建个人blog的文章网上有很多，但是其中一些多多少少有点问题，通过搭建本站进行了无数的踩坑，总结出了这篇搭建教程，一步步跟下来，应该都能搭建成功，如果有什么问题都可以在评论区给我留言

本地部署Hexo

一.准备

nodejs: 下载

git: 下载

二.安装本地hexo环境

nodejs和git的安装只需要无脑下一步即可，安装完成后可以在dos窗口进行检验，输入命令git -v，node -v，npm -v查看版本信息

三.安装hexo框架

在非系统盘下新建一个blog文件夹，进入文件夹后右键Git Bash Here

输入以下命令

1
2
3
4
5
6
7
8
9
10
11
12
13
14
//第一条   这是安装hexo的基础框架
npm install -g hexo

//第二条   这是初始化hexo框架 这个可能会比较慢
hexo init

//第三条 安装所需要的组件
npm install

//第四条 编译生成静态页面
hexo g

//第五条 启动本地服务
hexo s

安装完成之后可以去浏览器输入localhost:4000进行查看，效果如下:

部署到云服务器上

一.服务器和域名的购买

  • 云服务器可以选择阿里云，腾讯云，华为云，这里演示使用的是阿里云
  • 域名建议服务器在哪个平台就在哪个平台购买，域名买完一定要第一时间备案，国内的服务器是必须要备案的，如果是香港和外国的服务器则可以不用备案

二.云服务器操作(阿里云为例)

配置安全组规则

阿里云默认是不授权80端口访问的，这个端口，这个端口跑的是网页服务器的访问，所以要先把它开启，否则后面配置好后也无法访问

登录控制台->云服务器ECS->安全组->安全组ID->手动添加

配置服务器环境

安装服务器

远程链接云服务器后，我们需要安装搭载网站的服务器nginx，安装命令如下:

1
2
3
4
5
yum install nginx 安装nginx

systemctl start nginx 开启nginx服务

systemctl enable nginx 跟随系统启动

安装完成之后，使用公网ip访问，如果显示的是nginx或者是centos的欢迎界面的话就代表安装成功

创建博客目录

cd /home

mkdir www

cd www

mkdir website

我么们在本地上传的blog文件都会存放在这个文件夹中

回到home目录修改权限

cd /home

chmod -R 777 ./www

chmod -R 777 ./www/website

修改nginx配置文件

这里先写好配置文件，然后使用include的方式，引入到nginx的配置文件中

在/etc/nginx/的目录下创建vhost文件夹，在vhost文件夹下编写配置文件

cd /etc/nginx/

mkdir vhost

cd vhost

vim blog.conf

1
2
3
4
5
6
7
8
server{
	listen    80;
	root /home/www/website;
	server_name ;这里填你的域名
	location /{
	}
}
ps:注释文字要删掉

然后把这个文件引入到nginx的配置文件中，并修改server中的一些值

vim /etc/nginx/nginx.conf

1
2
// 找到"include /etc/nginx/conf.d/*.conf;", 在下方添加
include /etc/nginx/vhost/*.conf;

三.安装Git和node.js

1
2
3
4
5
6
//安装Git
yum install git

// 安装Node
curl -sL https://rpm.nodesource.com/setup_10.x | bash -
yum install -y nodejs

新建用户

新建一个git用户并修改权限

adduser git

chmod 740 /etc/sudoers

vim /etc/sudoers

修改配置文件，如下:

1
2
3
4
5
6
## Allow root to run any commands anywhere
root    ALL=(ALL)     ALL

添加以下内容

git 	ALL=(ALL)     ALL

再将权限修改过来

chmod 400 /etc/sudoers

配置免密登录

在本机桌面，右键Git Bash Here打开终端，执行如下命令(三次回车)

ssh-keygen -t rsa

在C:\Users\用户名.ssh中找到id_rsa.pub

回到服务器端执行如下操作:

1
2
3
4
5
6
7
8
9
sudo passwd git  //设置git密码
su git	//切换到git用户
cd ~	//切换目录
mkdir .ssh	//新建.ssh文件夹
cd .ssh	//进入文件夹
vim ~/.ssh/authorized_keys
# 然后将本机中生成的id_rsa.pub文件中的公钥复制到authorized_keys
chmod 600 ~/.ssh/authorized_keys
chmod 700 ~/.ssh

在本地Git终端测试连接云服务器

ssh -v git@你的公网IP

如果不需要输入密码就可以连接说明配置成功了，如果配置失败也不是什么大问题，只不过以后每次git需要输入密码

四.创建git仓库

在服务器端 创建git仓库

cd ~

git init --bare blog.git

vi ~/blog.git/hooks/post-receive

添加下面的代码:

1
git --work-tree=/home/www/website --git-dir=/home/git/blog.git checkout -f

修改权限

chmod +x ~/blog.git/hooks/post-receive

五.完成部署

修改hexo的配置文件，就是blog文件夹下的_config.yml

1
2
3
4
5
deploy:
  type: git
  repo: git@你的服务器公网IP:/home/git/blog.git
  branch: master
  message:

之后在git终端执行

hexo clean

hexo g

hexo d

最后重新运行nginx服务器即可(ps:每次hexo d后都要重启nginx服务器)

nginx -s reload

部署到GithubPage

如果对博客只是感兴趣想尝试一下，对访问速度没有那么高的需求也可以部署到Github上

一.配置SSH免密登录

  • 找到我们前面配置服务器免密登录生成的ssh key(也就是id_rsa.pub)，在我们的GitHub的设置里添加如下图

  • 配置完后在bash里输入ssh -T git@github.com测试是否可以链接到Github

二.创建仓库

  • 新建一个名为你的用户名.github.io的仓库(必须要是这样哦)
  • 若你的用户名为a，则新建仓库名为a.github.io

三.推送至Github

  • 修改_config.yml配置文件

    1
    2
    3
    4
    deploy:
      type: git
      repo: github上对应仓库的ssh 链接         
      branch: main #这里注意看自己的默认分支是什么，有的是master

  • 在blog目录下的bash中输入hexo g -d

  • 如果报ERROR Deployer not found: git，说明缺少组件，输入npm install hexo-deployer-git --save安装完成后重复上个步骤的命令即可推送

  • 推送完成后浏览器访问你的用户名.github.io就能看到你的博客啦