从零开始搭建 Hexo + NexT 个人博客（第一章：博客搭建）

发表于 更新于 分类于

🎭 第一章：博客搭建 - 面具后的数字世界

“记住，记住，混沌与微笑” - 在这个数字化的假面舞会中，我们将创造一个属于小丑与V字面具的舞台。

欢迎来到”V’s Joker”博客搭建系列的第一章。在这里，我们将从零开始，为您的数字面具搭建一个完美的舞台。

🧱 环境准备：搭建混沌的基石

在开始我们的假面舞会之前，需要准备好舞台的基础设施。

1. 安装 Node.js - 小丑的魔法盒

Node.js 就像小丑手中的魔法盒，里面装着无数可能性。

macOS 用户（推荐使用 nvm）：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
# 安装 nvm - 节点版本管理器
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.3/install.sh | bash

# 将魔法咒语添加到 ~/.zshrc
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"

# 重新加载配置（让魔法生效）
source ~/.zshrc

# 安装最新的 LTS 版本
nvm install --lts
nvm use --lts

# 验证魔法是否生效
node -v  # 应显示 v20.x.x
npm -v   # 应显示 10.x.x

Windows 用户：

  1. 访问 Node.js 官网
  2. 下载 Windows 系统的 .msi 安装包
  3. 运行安装程序，记得勾选 “Add to PATH” 选项

2. 安装 Git - V 字面具的记忆管理器

Git 帮助我们管理代码版本，就像V字面具背后的记忆片段。

macOS：

1
2
# 使用 Homebrew 安装
brew install git

Windows：

  1. 下载 Git
  2. 运行安装程序，使用默认设置

3. 配置 Git 身份

1
2
git config --global user.name "V.Joker"
git config --global user.email "[email protected]"

4. 安装 VS Code - 数字世界的编剧台

  1. 访问 VS Code 官网
  2. 下载并安装
  3. 推荐插件（为混沌增添色彩）：
    • Markdown All in One
    • Markdown Preview Enhanced
    • GitLens
    • One Dark Pro（暗黑主题，符合小丑风格）

5. 验证环境 - 确认魔法咒语

1
2
3
node -v     # 节点魔法 v20.x.x
npm -v      # 包管理魔法 10.x.x
git --version  # 版本控制魔法 2.x.x

📦 安装 Hexo - 小丑的舞台搭建工具

1. 全局安装 Hexo CLI

1
2
npm install -g hexo-cli
hexo -v  # 验证小丑的工具箱已就绪

2. 创建博客项目 - 搭建舞台

macOS 用户：

1
2
3
4
cd ~/Documents
mkdir vjoker-blog && cd vjoker-blog
hexo init
npm install

Windows 用户：

1
2
3
4
mkdir D:\vjoker-blog
cd /d D:\vjoker-blog
hexo init
npm install

3. 安装必要的魔法药剂（插件）

1
2
3
4
5
6
7
8
9
10
11
12
13
14
# Markdown 渲染魔法
npm install hexo-renderer-marked@latest --save

# 搜索功能（帮助访客在混沌中寻找真相）
npm install hexo-generator-searchdb --save

# 站点地图（为搜索引擎绘制舞台地图）
npm install hexo-generator-sitemap --save

# RSS Feed（让关注者订阅混沌更新）
npm install hexo-generator-feed --save

# 日期过滤器（时间在小丑的世界里也需要格式化）
npm install nunjucks-date-filter --save

🎨 安装 NexT 主题 - 为舞台穿上华丽的服装

1. 克隆主题（获取小丑的戏服）

1
git clone https://github.com/next-theme/hexo-theme-next themes/next