搭建环境
购买服务器
跟着操作,一直到能登陆实例停下
安装nginx
坑:记得配置防火墙,打开相应端口
nginx配置的细节,了解一下反向代理,后面需要配置nginx
安装node
坑:不要下载最新版本的node,会报错。头铁随意
安装pm2
记一下简单的指令,主要就是会用pm2跑项目就行
安装Xshell和Xftp
Xftp下载同理,使用方法也很简单,点击开启Xftp
部署next
ok现在环境就搭好了,可以开始部署我们的项目啦~
上传文件到服务器
先确保待上传的项目能在本地跑起来哈,也就是通过localhost:端口号能成功访问。
进入Xftp,把本地文件拖到服务器就可以上传文件到服务器啦,右边就是你得服务器的文件系统,主打就是一个可视化。除了node_modules,.git,.next我们把项目文件拉到右边(我是这样做的哈)。
如图:
安装依赖
npm i / yarn
,刷新之后能在xftp看到node_modules
运行项目
根据package.json文件来跑项目
注意我的配置项:
因为next项目在next start之前必须next build,所以我需要运行npm run build
再npm run start
才能成功运行项目。你也可以把这build和start两个操作写在一个命令去运行,注意顺序就行
如果直接start报错:解决方案
gpt回答为什么需要这么做:
在 Next.js 中,使用 next start
命令启动应用程序时,会生成一个生产就绪的构建。这个构建包含了所有需要的静态文件和服务器端代码,并且已经进行了优化以提高性能。
因此,在运行 next start
命令之前,必须先运行 next build
命令,以确保生成生产就绪的构建并准备好启动应用程序。如果直接运行 next start
命令而没有先运行 next build
命令,则可能会导致应用程序无法正常启动或出现其他错误。
ok知道如何让项目在本地跑起来了,在服务器也一样。不过我们要用pm2守护当前进程
pm2 start npm --name "next" -- run start
pm2 ls
查看当前守护的进程
如图:项目成功跑起来了
推荐一下光神的文章~
试试访问一下http://服务器ip:3001
(因为我项目开启的3001端口)发现访问不了
配置nginx
思考一下,当你访问http://服务器ip
时是nginx自带的一个html页面。其实就是访问了http://服务器ip:80
,80端口一般不显示而已。也就是说你访问80端口时nginx服务器会把默认把你的请求转发到别的地方去
进入配置nginx界面:
cd /usr/local/nginx/conf
vim nginx.conf
我的配置如图:
nginx将访问http://服务器ip:80
的请求转发到http://127.0.0.0:3001
,也就是我next项目在本地开启的端口,也就是说我们通过访问服务器的80端口就可以访问到项目了
退出界面:
按Esc后输入 :wq
修改配置后需要重启nginx服务器:
cd /usr/local/nginx/sbin
./nginx -s reload重启
(./nginx
启动服务器
./nginx -s stop
关闭服务器
./nginx -t
测试配置文件是否有错,这里有坑,小心把nginx.conf文件格式改错了,比如多了空格啥的就出错了。遇事不决就重装nginx吧T T
)
现在我们访问http://服务器ip
就能访问到你部署next项目啦!
接下来我们来部署nest项目,难点就是配置mysql
部署nest
安装mysql
这时你可以在本地远程连接服务器上的mysql了
别忘了在app.module配置mysql模块
上传文件
在此目录下执行pm2 start npm --name "next" -- run start
通过pm2守护当前nest进程。
pm2 ls
查看守护的所有进程
坑:执行pm2 start时报错: [PM2][ERROR] File ecosystem.config.js not found 查了很久资料没debug成功,最后选择卸载pm2:可以看看这个issue,卸载完直接npm i -g pm2
就完事了
到这nest就成功在服务器上运行啦!