宝塔安装next.js框架 / 本地同步到宝塔

原创已于 2026-08-20 11:22:13 修改 · 207 阅读

5 ·

本内容遵循CC 4.0 BY-SA版权协议

GEO检测

收录于

基础知识

于 2026-07-27 11:01:44 首次发布

安装Nginx 1.30.3 和 Node.js版本管理器 2.7 （注意版本）

进入终端 cd 你网站根目录，执行npx create-next-app@latest . 一路yes 就ok了

简单吧！接下来就可以基于next.js部署自己的网站了。

----------------

本地同步到宝塔

cd /www/wwwroot （cd你网站的根目录

git clone git@github.com:xxxx/odi-xxxx.cn.git odi （git clone 到你根目录的odi文件夹

如果服务器没有配 GitHub SSH key，用 HTTPS 方式（私有仓库会提示输用户名+token）：

git clone https://github.com/ijoanne888/odi-xxxx.cn.git odi
cd odi

# 不带 odi → 自动用仓库名作为目录名
git clone git@github.com:xxxx/odi-xxxx.cn.git
# 结果：/www/wwwroot/odi-xxxx.cn/

# 带 odi → 指定目录名叫 odi
git clone git@github.com:xxxx/odi-xxxx.cn.git odi
# 结果：/www/wwwroot/odi/

根据你想目录使用的node 安装对应的版本 node -v

npm ci

npm run build （把你的项目从“开发状态”打包成“可以部署上线的生产版本”。

cd /www/wwwroot/xxx.cn

npm install -g pm2

pm2 start npm --name "odi" -- start

pm2 save

pm2 startup

然后确认状态：

pm2 list

pm2 logs odi --lines 10 (看到 Ready on http://localhost:3000 就说明服务跑起来了，接着去宝塔配 Nginx 反向代理就行。

------------------

现在只剩最后一步——宝塔 Nginx 配置反向代理：

宝塔面板 → 网站 → 找到 xxx.cn → 设置 → 配置文件
在 server 块里加（或替换已有的 location /）：

location / {
    proxy_pass http://127.0.0.1:3002;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection 'upgrade';
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_cache_bypass $http_upgrade;
}

同时将以下内容注释

#location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$
#{
#    expires      30d;
#    error_log /dev/null;
#    access_log /dev/null;
#}

#location ~ .*\.(js|css)?$
#{
#    expires      12h;
#    error_log /dev/null;
#    access_log /dev/null;
#}

改完后先验证配置：nginx -t

没问题就保存，然后访问即可

标签

#next.js