Nuxt3 SSR 服务端渲染部署 PM2 全流程(Nest.js 同理)

项目打包

我们以 Nuxt3 项目为例子:

项目打包

  • 执行 npm run build , 生成的 .output 文件夹就是部署产物(目前不支持中文路径)
  • 执行 npm run preview 可以本地预览效果

方式一:使用 Node 部署

需要服务器安装 Node 环境

shell 复制代码
systemctl install nodejs
systemctl install npm # 安装npm是为后面安装库做准备
  • 运行:node .output/server/index.mjs
  • 指定端口:PORT=8888 node .output/server/index.mjs
  • PORT:是动态添加的环境变量

如果你要管理 Node 版本,可以安装 n 工具

shell 复制代码
npm install --g n
n --version # 查看版本

方式二:使用 PM2 部署(推荐)

认识PM2(Process Manager)

PM2是一个守护进程管理器, 它将帮助管理和保持你的在线应用程序。

更简单的理解:负责管理Node、Python等程序,并能让程序一直保持在后台运行。

安装PM2

shell 复制代码
npm install --g pm2

PM2 常用命令和配置文件

将打包后的文件上传到服务器

生成 pm2 配置文件

shell 复制代码
pm2 init simple #自动生成 ecosystem 配置文件

然后修改配置内容,主要是 SSR 服务器脚本启动路径

js 复制代码
module.exports = {
  apps : [{
    name   : "Nuxt3AppTest",
    exec_mode:'cluster',
    instances:'max',
    script : "./.output/server/index.mjs"
  }]
}

启动应用

shell 复制代码
pm2 start ecosystem.config.js # 启动应用

因为 Nuxt3 默认的端口号 3000,所以需要我们配置服务器的端口安全组,我以阿里云控制台为例子

然后输入你的 IP + 3000端口就可以访问了~(记得要配置上面服务器可访问3000端口安全组,否则可采用 Nginx 做代理也可以)

参考资料

Nuxt.js(Vue SSR)创建项目到服务器(Nginx+PM2)部署详细流程

相关推荐
蓝莓味的口香糖13 分钟前
【JS】什么是单例模式
开发语言·javascript·单例模式
linux kernel1 小时前
第二十三讲:特殊类和类型转换
开发语言·c++
笨蛋少年派1 小时前
JAVA基础语法
java·开发语言
渡我白衣1 小时前
深入剖析:boost::intrusive_ptr 与 std::shared_ptr 的性能边界和实现哲学
开发语言·c++·spring
爱吃小胖橘1 小时前
Lua语法
开发语言·unity·lua
怀旧,1 小时前
【C++】26. 智能指针
开发语言·c++·算法
Aevget1 小时前
PHP智能开发工具PhpStorm v2025.2全新上线——支持PHPUnit 12等
开发语言·ide·php·phpstorm
东方芷兰2 小时前
JavaWeb 课堂笔记 —— 20 SpringBootWeb案例 配置文件
java·开发语言·笔记·算法·log4j·intellij-idea·lua
许商2 小时前
【stm32】bash自动配置buildenv
开发语言·bash
reembarkation2 小时前
自定义分页控件,只显示当前页码的前后N页
开发语言·前端·javascript