在服务器上搭建你的个人博客

博客 hexo Node.js

Word count: 1.2kReading time: 5 min

 2023/12/21

写在前面

我搭建个人博客，是对未知的好奇和对新事物的渴望，并非出于技术大牛的自恋（我本身也不是学这个的），而是我相信每个人都可以拥有一个属于自己的独特空间。我将简单分享我搭建博客的过程，让你能够轻松掌握，成为你记录生活、分享见解的舞台。

你需要购买或下载以下服务或工具

服务器
域名
SSH软件
一个cloudflare账户

本文是在 Debian 系统中通过轻量的 Nginx WEB 服务器部署 Hexo 框架的 blog。
Hexo 是一个快速、简洁且高效的博客框架。使用 Markdown 解析文章，在几秒内，即可利用靓丽的主题生成静态网页。

步骤1：安装 Hexo

首先，在 SSH 终端连接服务器并执行以下命令安装 Node.js、Git 和 nano 编辑器。
因为 Hexo 通常使用 Git 来管理博客的主题和插件，Git 也是必不可少的。
在询问是否安装时，输入 “y” 继续。

sudo apt update
sudo apt install nodejs
sudo apt install git
sudo apt install nano
sudo apt install npm

安装 hexo

1	sudo npm install -g hexo-cli

hexo 安装好了

步骤2：创建 Hexo 博客

在常用位置创建一个新的 Hexo 博客

1	hexo init /var/www/html/myblog

进度条跑完，你的 blog 就创建好了
（如果你想将主题配置好后，再生成静态文件，请跳转到第6步，配置完后再回到第3步）

步骤3：生成博客静态文件

进入博客目录：

1	cd /var/www/html/myblog

在博客目录中运行以下命令生成静态文件：

1	hexo generate

步骤4：配置 Nginx

确保你已经安装了 Nginx。如果没有，请使用以下命令安装：
1
sudo apt install nginx

创建一个新的 Nginx 配置文件：

1	sudo nano /etc/nginx/sites-available/myblog

在文件中添加以下配置，替换 [your_domain_or_ip] 为你的域名或IP地址，[your/hexo/path] 为你的 Hexo 博客路径(按上面操作下来的话，路径为/var/www/html/myblog)：

server {
    listen 80;
    server_name your_domain_or_ip;

    location / {
        root /var/www/html/myblog/public;
        index index.html;
    }

    location ~ ^/(archives|categories|tags|about|404|page) {
        root /var/www/html/myblog/public;
        index index.html;
    }

    location ~ \.(css|js|png|jpg|gif|ico|svg|eot|ttf|woff)$ {
        root /var/www/html/myblog/public;
        expires 1y;
        add_header Cache-Control "public";
    }

    error_page 404 /404.html;
    error_page 500 502 503 504 /50x.html;

    location = /50x.html {
        root /usr/share/nginx/html;
    }
}

保存并关闭文件。(输入”Ctrl+X”，然后”Y”，然后”Enter”)
然后创建一个符号链接，启用站点配置：
1
sudo ln -s /etc/nginx/sites-available/myblog /etc/nginx/sites-enabled/
检查 Nginx 配置是否正确：
1
sudo nginx -t
如果没有错误，重新加载 Nginx：
1
sudo service nginx reload

步骤5：访问你的博客

现在，你可以通过浏览器访问 http://your_domain_or_ip 来查看你的 Hexo 博客了。

步骤6：选择喜欢的主题，并替换

恭喜你！
来到这一步，说明你的网站运行正常。

下面让我们来选择一个喜欢的主题，并进行一些简单的配置。

我们去 hexo官网挑选一个自己喜欢的主题。本文以 fi3ework 大佬的主题为例。
前面我们有安装Git，SSH软件进入到myblog目录
1
cd /var/www/html/myblog

拉取 Archer 主题文件到 themes/archer 目录

1	git clone https://github.com/fi3ework/hexo-theme-archer.git themes/archer --depth=1

安装主题依赖, Archer 主题依赖于 hexo-generator-json-content 插件生成侧边栏索引
1
npm install hexo-generator-json-content

打开/var/www/html/myblog目录下的 _config.yml 文件，添加如下字段：

jsonContent:
  meta: true
  pages: false
  posts:
    title: true
    date: true
    path: true
    text: false
    raw: false
    content: false
    slug: false
    updated: false
    comments: false
    link: false
    permalink: true
    excerpt: false
    categories: true
    tags: true

同上一步，修改 _config.yml 文件底部，修改 Hexo 主题为 Archer：
1
theme: archer
配置 About 页面，在 Hexo 根目录下执行如下命令：
（/var/www/html/myblog，如果退出了，执行cd /var/www/html/myblog）
1
hexo new page "about"
打开/var/www/html/myblog/source/about/目录下的 index.md 文件，修改/添加以下内容：
1
2
3
4
5
---
title: 您的自我介绍标题
layout: about
---
您的自我介绍正文
其中 layout: about 字段为必要的且不可修改为其它值。
配置 /var/www/html/myblog/Archer 主题目录下的 _config.yml 文件以开启 About 页面：
1
2
3
about:
enable: true
image: '/intro/about-page.jpg'
其它的一些修改也在这里进行，可查看示例文件：

步骤7：配置好了你选择的主题，再次生成静态文件

进入博客目录：
1
cd /var/www/html/myblog
在博客目录中运行以下命令生成静态文件：
1
hexo generate
运行
1
hexo g

步骤8：访问你的配置了主题的船新版本的博客

通过浏览器访问 http://your_domain_or_ip 来查看你的配置了主题的船新版本的博客了。

Next Post

在服务器上搭建开源的Telegram人形Bot
Previous Post

利用CF和域名免费搭建属于自己的反代

CATALOG

1. 写在前面
2. 你需要购买或下载以下服务或工具
3. 步骤1：安装 Hexo
4. 步骤2：创建 Hexo 博客
5. 步骤3：生成博客静态文件
6. 步骤4：配置 Nginx
7. 步骤5：访问你的博客
8. 步骤6：选择喜欢的主题，并替换
9. 步骤7：配置好了你选择的主题，再次生成静态文件
10. 步骤8：访问你的配置了主题的船新版本的博客