Mizuki 二次元静态博客模板 部署教程（整洁排版 · 新手友好）

一、前置要求（用前必看）

部署前需确保系统已安装以下工具，版本需满足：

• Node.js >= 20
• pnpm >= 9
• Git

项目地址：GitHub - matsuzaka-yuki/Mizuki

推荐：下载 Node.js®

Windows版Git下载 下载Git

二、环境安装

1. Node.js 安装（Linux 版）

步骤1：安装 nvm（Node 版本管理器）

• 通用命令：

  curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.3/install.sh | bash

• 国内服务器加速命令：

  curl -o- https://gitee.com/mirrors/nvm/raw/v0.40.1/install.sh | bash

步骤2：重启 Shell 并加载 nvm

\. "$HOME/.nvm/nvm.sh"

步骤3：安装 Node.js v24.11.1

nvm install 24

步骤4：验证版本

# 验证 Node.js 版本
node -v
# 验证 npm 版本
npm -v

步骤5：安装 pnpm

npm install -g pnpm
# 验证 pnpm 版本
pnpm -v

💡 Windows 系统：需前往 Node.js 官网查看对应安装教程（附：Windows 版 nodejs 教程 来源：默认云盘）

2. Git 安装

Ubuntu/Debian 系统

sudo apt-get install git-core

CentOS 系统

sudo yum install git-core

Windows 系统

Windows 版 Git 下载（来源：默认云盘）

💡 其他系统：访问 Git 官网下载对应版本。

三、Mizuki 部署步骤

1. 克隆项目到本地

• 通用命令：

  git clone https://github.com/matsuzaka-yuki/mizuki.git

• 国内服务器加速命令：

  git clone https://gh.llkk.cc/https://github.com/matsuzaka-yuki/mizuki.git

2. 进入项目目录

cd Mizuki

3. 安装项目依赖

pnpm install

4. 自定义配置（关键）

编辑 src/config.ts 文件，按需修改：

• 站点基础信息（标题、描述、域名等）
• 主题颜色、横幅图片
• 社交链接（GitHub、微博等）

5. 启动开发服务器（本地预览）

pnpm dev

启动后在浏览器访问提示的地址，即可预览博客效果。

6. 打包静态文件

pnpm build

打包完成后，静态文件会生成在 dist 目录中。

四、部署上线

1. 部署方式：dist 目录可部署至：
   • 自有服务器（Nginx/Apache 托管）
   • GitHub Pages
   • Vercel（推荐）
   • 虚拟主机
2. 项目特性：纯前端项目，无后端、无数据库，所有配置需手动编辑文件。
3. 推荐方案：部署到 Vercel，支持修改后自动部署，无需手动上传文件。

五、补充说明

• 若部署后不会使用，可查看项目配套的具体使用教程。
• 全程无后端依赖，只需维护静态文件和配置文件即可。

总结

1. 部署前需安装 Node.js(≥20)、pnpm(≥9)、Git 并验证版本；
2. 克隆项目后安装依赖、修改配置文件，本地预览无误后打包；
3. 打包后的 dist 目录可部署至多种平台，推荐 Vercel 实现自动部署。

分享到：

赞 (0) 打赏