部署项目教程 - 一只喵⁹

674 字

3 分钟

部署项目教程

2026-09-23

浏览量加载中...

本教程大部分内容仅作用于新手小白，如有需要可根据自己的需求进行步骤调整。

备注：有问题请先问 AI。

0. 准备工具#

🔧 所需工具#

分类	工具说明
🌐浏览器	Edge、Chrome 等任意现代浏览器均可
✏️代码编辑器	推荐 PyCharm，也可使用 VS Code
⚙️项目环境	Node.js + pnpm，项目运行环境与依赖包管理器
🚀可选工具	网络加速工具，访问 GitHub 不畅时选用

⚠️ 提示：安装完成后，可在终端输入下面命令校验环境是否就绪

1
node -v
2
pnpm -v
3
git --version

1. 下载源码#

两种方式任选其一，推荐方法一 Git 克隆，可以方便后续更新代码。

✅ 方法一：PyCharm 终端 Git 克隆（推荐）#

打开 PyCharm，新建一个空项目。
1.新建项目
在底部终端中执行克隆命令，优先第一条：

1
git clone https://github.com/LuvGaze/Blog.git
2
# 或者 SSH 方式（配置过 GitHub 密钥才可用）
3
git clone git@github.com:LuvGaze/Blog.git

若上面两个都失败了，使用 GH Proxy 加速地址：

1
# 加速地址1
2
git clone https://v4.gh-proxy.org/https://github.com/LuvGaze/Blog.git
3
# 加速地址2
4
git clone https://gh-proxy.org/https://github.com/LuvGaze/Blog.git

📦 方法二：浏览器直接下载源码压缩包（备选）#

访问项目仓库：https://github.com/LuvGaze/Blog
在仓库页面点击 Code → Download ZIP 下载源码压缩包
下载完成后解压到项目文件夹内。
3.浏览器下载源码

2. 本地启动项目#

进入项目目录，依次执行下面命令：

1
cd Blog
2
pnpm install
3
pnpm build
4
pnpm dev

✅ 启动成功判断：终端输出本地地址 [http://localhost:4321]，浏览器打开能正常显示博客页面，代表本地运行无误，可以准备部署到云端。

3. 部署项目到云端#

📌 重点：第 2 步的 pnpm build 执行成功后，会在项目内生成 dist 文件夹，dist 里面就是静态网站文件。

将 dist 里面所有文件（不是 dist 文件夹本身）上传到你的服务器 / 虚拟主机网站根目录
在服务器面板配置网站，设置伪静态规则
绑定域名并做好 DNS 解析，完成后即可通过域名访问博客。

📋 补充常见问题#

pnpm: 不是内部命令 ：没有安装 pnpm，需要先安装 Node.js，再全局安装 pnpm。

1
npm install -g pnpm

git 不是内部命令 ：本地未安装 Git，下载 Git 并添加环境变量，安装完成重启编辑器终端。
build 构建报错 ：检查 Node 版本，删除 node_modules 和 pnpm-lock.yaml，重新执行 pnpm install。
如何修改博客 ：详情请参考文章博客功能使用教程