1.安装Node.js

​ 在浏览器搜索Node.js或者直接输入网址https://nodejs.org/zh-cn 打开网页后点击绿色按钮下载(如下图所示)。

下载后会得到一个安装包程序，按步骤安装即可

image-20250322154016053

2.安装Hexo

​ Hexo是一个免费开源的博客框架，这个框架非常流行，我的博客也是基于此框架搭建的。如果想要了解关于这个框架的API、插件、文档等，可以访问其网址https://hexo.io/zh-cn/

安装Hexo的安装步骤：

  • 按下Win+R按键，输入cmd运行
  • 然后在终端中按顺序输入下面5条命令即可安装成功
1
2
3
4
5
$ npm install hexo-cli -g
$ hexo init blog
$ cd blog
$ npm install
$ hexo server

上面步骤执行后可以看见终端打印信息包http://localhost:4000/，这就是你本地的博客地址。

​ 恭喜你！打开这个链接后就能看到你自己的博客啦。

3.配置自己的主题

完成上面的安装后就拥有了自己的博客框架，Hexo支持420种主题，你查阅Hexo官网来选取自己喜欢的主题。我这里选择的主题也是非常流行的Butterfly.

安装主题

首先还是按下Win+R键,输入cmd打开终端，然后输入 cd blog切换到blog目录下

然后输入下面命令

1
git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly

注意！如果上面命令安装较慢或者无法安装的话，可以输入下面一行命令在Gitee仓库中安装。(上面仓库部署在Github，需要连接外网)

1
git clone https://gitee.com/immyw/hexo-theme-butterfly.git themes/butterfly

应用主题

完成上面安装后，在C:\Users\你的用户名\blog文件下找到**_config.yml**文件并打开(如果安装到了别的路径需要在相应安装路径下寻找)

然后在theme部分输入butterfly保存 (注意 :后要空格)

然后在终端blog目录下输入下面命令后打开 http://localhost:4000/ 就完成了主题应用

1
hexo c && hexo g && hexo s

PS：

​ 到这里你的博客基本上有了一个雏形，接下来Butterfly主题则是根据你自己的需要和兴趣进行配置即可。具体配置细节可以参考下面这 个网站https://butterfly.js.org/

4.服务器部署

​ 这里我使用的是阿里云的云服务器，进行学生认证后可以领取一张300元的优惠券，可以用来免费购买云服务器来使用。如果你有需要的话请打开这个网址进行学生认证即可http://a1.ilz6.com/aliyun

​ 服务器配置后会有一个公网IP,比如我这个公网IP为60.205.234.89.

接着远程SSH连接到你的服务器：

Git安装

安装编译工具、依赖包

1
2
3
yum install -y curl-devel expat-devel gettext-devel openssl-devel zlib-devel 
yum install -y gcc perl-ExtUtils-MakeMaker 
yum install wget -y

下载新版本Git

1
2
3
4
5
6
7
8
yum remove git -y
cd
wget https://www.kernel.org/pub/software/scm/git/git-2.49.0.tar.gz --no-check-certificate
tar -zxf git-2.34.0.tar.gz
cd git-2.34.0
make all prefix=/usr/local/git
echo 'export PATH=$PATH:/usr/local/git/bin' >> /etc/bashrc
source /etc/bashrc

查看到git版本号则安装成功

1
git --version

Git仓库配置

创建git文件夹

1
2
mkdir /home/git/
chmod -R 755 /home/git/
1
2
cd /home/git/
git init --bare blog.git

进入Vim编辑器

1
vim /home/git/blog.git/hooks/post-receive

将下面两行粘贴到 vim编辑器中

1
2
#!/bin/bash
git --work-tree=/home/blog --git-dir=/home/git/blog.git checkout -f

然后 修改权限

1
chmod +x /home/git/blog.git/hooks/post-receive

Nginx安装及启动

观察到nginx服务状态为 绿色active即启动成功

1
2
3
yum install -y nginx
systemctl start nginx.service
systemctl status nginx.service

输入下面命令 找到nginx配置文件路径 我的是在**/etc/nginx/nginx.conf**

1
nginx -t

找到路径后将配置文件路径带入your_path中执行

1
vim /your_path/nginx.conf

最重要的一步！找到下面部分，将其中root和 server_name分别替换为你的 blog地址 和 你的服务器域名

1
2
3
4
5
6
7
8
9
10
11
12
13
server {
    listen 80 default_server;
    listen [::]:80 default_server;
    root /home/blog;    # 修改为创建的blog目录地址
    server_name www.example.com; # 修改为你的域名或者公网ip
    
    # Load configuration files for the default server block.
    include /etc/nginx/default.d/*.conf;
    location / {
    }
    error_page 404 /404.html;
        location = /40x.html {
    }

保存后重启nginx

1
systemctl restart nginx.service

最后部署

完成上面步骤后，回到本机找到你的blog文件夹，默认路径是C:\Users\你的用户名\blog，打开该目录下的_config.yaml文件

在_config.yaml文件按下Ctrl+F 搜索 deploy并且替换为下面的命令

1
2
3
4
deploy:
  type: git
  repository: [username]@你的公网ip或者域名:/home/git/blog.git   #用户名@服务器Ip:git仓库位置
  branch: master

配置完后终端中执行下面命令

1
npm install hexo-deployer-git --save

然后执行下面命令 输入服务器密码即可成功部署

1
hexo clean && hexo generated && hexo d

完成上面步骤后，在浏览器输入你的公网IP或者域名，即可访问到你的博客啦。