腾讯云 部署Nuxt4项目详细指南
进入 腾讯云控制后台 > 轻量云服务器 > 服务器, 点击登录, 验证后进入界面会看到:
[root@VM-16-11-opencloudos ~]#
这里是是 Linux 系统的命令行提示符, 各部分拆解的含义内容如下
root:当前登录的用户名(这里是超级管理员)@VM-16-11-opencloudos:主机名,云服务商自动命名的虚拟机~:当前所在目录(~ 表示用户的目录,这里是 /root)#:权限标识符(# 表示 root 权限,普通用户显示 $)整体连接起来就是: 你现在是以最高权限用户(root)登录到一个运行 OpenCloudOS(一种国产 Linux 发行版)的云服务器。系统等待你输入命令(光标会闪烁在 # 符号后)。
下面开始在云服务器上部署项目
Nuxt4 需要运行在 Node.js 20.x 或更高版本, 我选择的是 v20.19.4, 其他版本可以访问 nodejs 官方版本 下载
wget https://nodejs.org/dist/v20.11.1/node-v20.19.4-linux-x64.tar.xz
tar xf node-v16.14.0-linux-x64.tar.xz
mv node-v20.19.4-linux-x64 /usr/local/node
# 编辑配置文件
vim /etc/profile
然后会出来文件的详细内容,移动到文件的末尾, 按下 i 进入编辑模式, 添加如下内容
export NODEJS=/usr/local/node
export PATH=$NODEJS/bin:$PATH
按下 Esc 键退出编辑模式, 然后输入 :wq 保存并退出。
source /etc/profile
node -v
# v20.19.4
npm config set registry https://registry.npmmirror.com
npm config get registry
# https://registry.npmmirror.com/
如果项目是静态网站,或者项目中没有用到mysql, 那么就不需要安装 mysql, 可以跳过这一步
介绍一下 dnf, 为什么要用它
dnf 是一个包管理工具, 相当于 Node 的 npm, 相比于 wget, dnf 有依赖解析, 并且能够方便的进行包的移除(remove)和更新(update). 还有就是 wget 手动安装 mysql 太麻烦了, 要进行好多配置, 不太适合小白, 我是浪费了一个下午, 最后还是选择用 dnf.
这里要提一点: 不同发行版的 Linux 包管理工具不同, 常见的有 dnf, yum, apt 等, 我的轻量云服务器是 OpenCloudOS9+, 基于 RHEL/CentOS 9, 内置了 dnf 包管理工具. 感兴趣的可以看看这篇文章 Linux 下载 wget 和包管理工具 apt、yum、dnf 的对比
dnf install mysql-server
在安装过程中,系统可能会提示你确认安装。输入 y 然后按回车继续。
systemctl start mysqld
systemctl enable mysqld
在 /var/log/mysql/mysqld.log 中找到临时密码,mysqld.log 也可能在 /var/log/mysqld.log
grep 'password' /var/log/mysql/mysqld.log
回车后可能提示你: root@localhost is created with an empty password ! 这是不用密码登录
# 如果有临时密码, 输入命令回车后输入临时密码登录
mysql -u root -p
# 不用密码登录
mysql -u root
mysql> ALTER USER 'root'@'localhost' IDENTIFIED BY '新密码';
mysql> use mysql;
mysql> select user,host from user;
+------------------+-----------+
| user | host |
+------------------+-----------+
| mysql.infoschema | localhost |
| mysql.session | localhost |
| mysql.sys | localhost |
| root | localhost |
+------------------+-----------+
# localhost 代表只能本地访问 %代表所有人都可以访问
# 设置所有人都可以访问
mysql> update user set host='%' where user='root';
# 刷新服务配置项
mysql> FLUSH PRIVILEGES;
mysql> ALTER USER 'root'@'%' IDENTIFIED WITH mysql_native_password BY 'root_pwd';
## 授权root远程登录 后面的root_pwd代表登录密码
在 服务器详情>防火墙 中点击添加规则, 设置 MySQL 服务(3306)为允许



ip 地址可以从服务器详情中获取, 一般选择公网 ip

PM2 是一个 Node.js 进程管理器,用于管理和守护 Node.js 应用程序,使其在后台稳定运行。PM2 的主要功能:
为了防止应用崩溃导致服务中断,以及更好的管理应用,我们需要 PM2。
npm install pm2 -g
.output目录npm run build
.output目录下, 新建一个ecosystem.config.cjs 文件, 用于启动项目module.exports = {
apps: [
// 是一个数组,可以定义多个应用(每个应用一个对象)。
{
//应用名称
name: "ProjectName",
port: "3000",
// 进程模式:'fork'(默认):单进程运行 'cluster':多进程集群模式(利用多核 CPU)
exec_mode: "cluster",
// 集群模式下的进程数量: 'max':自动使用所有可用的 CPU 核心数。 还可以是数字,例如4,手动指定进程数量
instances: "max",
// 应用的入口文件路径:
script: "./server/index.mjs",
},
],
};
.output目录上传到服务器 root 目录下在腾讯云 OrcaTerm 平台 虚拟机名称下有个文件管理平台按钮, 点击可以上传文件到指定目录

输入命令查看目录中是否有.output 目录, 有的话就上传成功了
ls -a
cd .output
pm2 start ecosystem.config.cjs
#启动成功后可以使用下边的命令看一下启动的服务列表 online就表示成功了
pm2 list
项目运行在 3000 端口, 可以使用命令查看 3000 端口是否在运行
netstat -tunlp | grep 3000
tcp6 0 0 :::3000 :::* LISTEN 861089/PM2 v6.0.8:
pm2 startup
现在项目部署成功, 可以使用服务器公网 ip:3000 访问
如果访问不了, 可能是防火墙问题, 进入云服务器详情>防火墙, 点击添加规则, 允许 3000 端口访问
部署项目后老是提示 Cannot find module 'semver'
巨巨巨无语, 上传.ouput 目录的时候 node_modules 中的 semver 目录没有上传到服务器, 本地打包的依赖是有 semver 这个目录的, 不知道是屏蔽了还是怎么了, 单独上传 semver 目录就可以了.
.env 环境变量问题
以下内容是亲测!
新建了 .env.production , .env.development 文件, 但是运行起来是访问不了的, 这样才行:
"build": "nuxt build --dotenv .env.production",
"dev": "nuxt dev --dotenv .env.development",
development 环境下可以直接通过process.env获取到环境变量, 但是 production 环境下通过process.env是获取不到, 得加在runtimeConfig里面:
export default defineNuxtConfig({
runtimeConfig: {
mysqlConfig: {
host: process.env.NUXT_MYSQL_HOST,
port: process.env.NUXT_MYSQL_PORT,
user: process.env.NUXT_MYSQL_USER,
password: process.env.NUXT_MYSQL_PASSWORD,
database: process.env.NUXT_MYSQL_DATABASE,
},
},
});
前面部署了项目, 通过 ip+3000 端口就可以访问网站, 但是正常的网站应该是输入域名访问网站.
在这里需要知道 http 协议如果没有指定端口那么默认就是走 80 端口, https 协议如果没有指定端口默认就是走 443 端口, 所以我们可以利用 Nginx 反向代理, 将 80 端口和 443 端口都代理到 3000 端口.
这样访问 ip 时就能直接访问域名, 再将 ip 解析到域名, 就可以通过域名访问网站了.
dnf install nginx
nginx 的配置文件有主配置文件和额外配置文件
/etc/nginx/nginx.conf/etc/nginx/conf.d/cd /etc/nginx/conf.d
在额外配置文件目录下新建一个配置文件,可以以你的站点名命名, 所例如 gearbox.conf
touch gearbox.conf
配置 Nginx 将 80 端口代理到 3000 端口
打开前面创建的配置文件
vim gearbox.conf
按 i 进入编辑模式, 复制下面的配置, ctrl+shift+v 粘贴到 gearbox.conf 中,这里的 example.com 要填自己的域名
server {
listen 80;
listen [::]:80;
server_name example.com www.example.com;
location / {
proxy_pass http://localhost:3000;
}
}
Esc 退出编辑模式, 输入 :wq 保存并退出
systemctl start nginx
# 设置开机自启动
systemctl enable nginx
这个时候输入域名就可以访问了, 域名没有备案的话要先备案才能访问