部署 Gatsby 博客到 VPS(虚拟私人服务器)是一个充满挑战的过程。在这篇文章中,主要是记录自己的博客部署流程以及一些踩坑要点,可能对别人不大具有参考价值,不喜勿喷。
在开始之前,确保你已经准备好以下几样东西:
首先,登录到你的 VPS,并更新系统:
sudo yum update由于 CentOS 默认的 Yum 仓库中可能不包含最新版本的 Node.js,我们将使用 NVM(Node Version Manager)来安装和管理 Node.js 版本。
安装 NVM:
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.0/install.sh | bash激活 NVM 环境(或重新登录):
export NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"安装 Node.js:
# 这里安装的是node的21版本
nvm install 21使用 npm 全局安装 Gatsby CLI:
npm install -g gatsby-cli使用 Git 克隆你的 Gatsby 项目到 VPS:
git clone <你的仓库URL>
cd <你的项目目录>在项目目录中,安装依赖并构建你的 Gatsby 站点:
npm install
gatsby build现象:Gatsby 需要较新版本的 Node.js,而 VPS 上的版本过旧。
解决方案:使用 NVM 安装并使用合适的 Node.js 版本。
现象:在 VPS 上运行 Gatsby 时,某些插件没有找到正确的路径。
解决方案:检查并确保所有的依赖都已正确安装。在某些情况下,可能需要手动指定插件的路径或重新安装问题插件。
使用 Gatsby CLI 在服务器上启动你的站点:
gatsby serve --host 0.0.0.0 --port 8000如果你有 Nginx,可以配置它作为反向代理来提供你的 Gatsby 站点。
如果你的域名是通过 GoDaddy 注册的,你需要配置 DNS 以将域名指向你的 VPS IP 地址:
登录到你的 GoDaddy 账户。
转到“我的产品”页面,然后找到你的域名。
在域名设置中,找到 DNS 管理或 DNS 设置部分。
添加或修改 A 记录,将域名指向你的 VPS IP 地址:
保存更改。请注意,DNS 更改可能需要一些时间(最多 48 小时)来全球生效。
配置 Nginx 作为反向代理来提供你的 Gatsby 站点。以下是一个基本的 Nginx 配置示例:
打开或创建一个新的 Nginx 配置文件:
sudo nano /etc/nginx/sites-available/yourdomain.com添加以下配置:
server {
listen 80;
server_name yourdomain.com www.yourdomain.com;
location / {
proxy_pass http://localhost:8000; # 确保这里的端口与 Gatsby serve 使用的端口匹配
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
}
}激活配置文件:
sudo ln -s /etc/nginx/sites-available/yourdomain.com /etc/nginx/sites-enabled/测试 Nginx 配置是否正确:
sudo nginx -t重新加载 Nginx 以应用更改:
sudo systemctl reload nginx部署 Gatsby 博客到 VPS 是一个涉及多个步骤的过程,可能会遇到各种挑战。使用Gpt还是挺方便的,最终成功部署站点。希望我的经验能帮助你顺利完成部署!
大致流程:代码同步->编译 npm install -> 部署 npm build && npm serve 或者 npm run start -> 配置dns映射 -> 配置nginx端口转发 -> 配置https
sudo fallocate -l 1G /swapfile # 创建一个 1GB 的交换文件
sudo chmod 600 /swapfile # 设置正确的权限
sudo mkswap /swapfile # 设置交换区
sudo swapon /swapfile # 启用交换区然后在/etc/fstab添加行
/swapfile swap swap defaults 0 0即时生效,这样就多了虚拟内存了(多亏了chatgpt,终于解决我多年无法在vps上部署博客的问题了)