Nuxt3打包部署到Linux(node+pm2安装和运行步骤+nginx代理)

最近,我们项目组的工作接近尾声,需要把项目部署上线。由于前端第一次使用Nuxt3框架,后端也是第一次部署Nuxt3项目,所以刚开始出现了很多问题。在我上网搜索很多教程后,得到了基本的流程。

1.服务器安装node.js环境

Nuxt3官方文档https://nuxt.com/docs/getting-started/installation通过官方文档我们可知,nuxt3要求nodejs 环境在16.10.0v以上

1.下载安装包

# 下载到当前文件夹(可以访问https://nodejs.org/dist/这个地址选择源)
wget https://nodejs.org/dist/v16.14.0/node-v16.14.0-linux-x64.tar.xz

2.解压

# 解压到当前文件夹
tar xf node-v16.14.0-linux-x64.tar.xz

3.建一个node文件夹并且把解压的文件夹移动到当前目录

mv node-v16.14.0-linux-x64 /usr/local/node

4.配置环境变量

# 编辑配置文件
vim /etc/profile# 在profile文件末尾添加(移动的位置)
export NODEJS=/usr/local/node
export PATH=$NODEJS/bin:$PATH

5.保存后重新加载配置

source /etc/profile

6.检查nodejs是否配置成功

node -v

 出现版本即代表安装成功

7.配置淘宝镜像并查看是否成功

# 配置淘宝镜像
npm config set registry=https://registry.npmmirror.com/
# 检测是否切换成功
npm config get registry

2.安装Nuxt3的运行管理工具 pm2

npm install pm2 -g

3.将前端打包好的 .output 文件上传到服务器

上传成功后可能 ls 不显示,这个时候可以 ls -a 一下,就可以发现 .output 文件了

4.配置ecosystem.config.js文件

如果要使用pm2 管理运行项目,需要在根目录下配置 ecosystem.config.js 文件

module.exports = {apps: [{name: 'NuxtAppName',  // 设置启动项目名称exec_mode: 'cluster',instances: 'max',// 注意这里的相对路径script: './.output/server/index.mjs'}]
}

此时项目结构是这样的

5.使用pm2 启动 nuxt3项目

需要在项目的根目录下面执行命令

pm2 start ecosystem.config.js
# 然后使用下边的命令看一下启动的服务列表
pm2 list

 online就表示成功了,能够正常访问项目了。此时可以用命令看一下3000端口是否在运行

netstat -nltp
[root@FrankZhang .output]# netstat -nltp
Active Internet connections (only servers)
Proto Recv-Q Send-Q Local Address           Foreign Address         State       PID/Program name    
tcp        0      0 0.0.0.0:6379            0.0.0.0:*               LISTEN      32246/./redis-serve 
tcp        0      0 0.0.0.0:111             0.0.0.0:*               LISTEN      570/rpcbind         
tcp        0      0 0.0.0.0:80              0.0.0.0:*               LISTEN      21866/nginx: master 
tcp        0      0 0.0.0.0:22              0.0.0.0:*               LISTEN      1357/sshd           
tcp        0      0 127.0.0.1:25            0.0.0.0:*               LISTEN      1137/master         
tcp        0      0 0.0.0.0:443             0.0.0.0:*               LISTEN      21866/nginx: master 
tcp6       0      0 :::33060                :::*                    LISTEN      4743/mysqld         
tcp6       0      0 :::3306                 :::*                    LISTEN      4743/mysqld         
tcp6       0      0 :::111                  :::*                    LISTEN      570/rpcbind         
tcp6       0      0 :::80                   :::*                    LISTEN      21866/nginx: master 
tcp6       0      0 :::8085                 :::*                    LISTEN      21078/interviewV2   
tcp6       0      0 :::3000                 :::*                    LISTEN      1233/PM2 v5.3.0: Go 

在运行说明项目部署成功了。

设置自动重启,当服务器故障或者重启的时候,pm2会自动重启,不需要人为重启pm2服务

pm2 startup

如果出现问题,项目启动不起来,可以查看pm2服务执行日志,在日志里找出问题。一下是一些常用的Pm2命令

pm2 logs name(服务名)     //查看服务执行日志
pm2 delete name(服务名)   //删除服务
pm2 stop name(服务名)     //停止服务
pm2 start name(服务名)    //启动服务
pm2 restart name(服务名)  //重启服务

6.Nginx配置代理,80访问3000

因为3000端口不是我们期望让用户得知的,希望通过Nginx的反向代理,隐藏真实的端口,我们可以在nginx的配置文件里这样写

server {listen      80;listen    [::]:80;server_name localhost;location / {proxy_pass http://localhost:3000;}location /interviewV2/ {proxy_pass http://127.0.0.1:8085;}
}

这个和传统的前端打包 dist 文件配置nginx不一样。dist是一种静态资源,nuxt3是在服务器上运行一个服务,通过nginx代理到这个服务的端口号从而访问项目的前端页面。然后在操作页面的时候会发请求到后端项目的端口。然后整个项目就跑通了。

注意:如果是docker启动的nginx,一定要看好docker0的ip地址,就不能填写localhost,127.0.0.1这种ip了,因为docker启动的容器,相当于一台服务器去请求另一台服务器,这个地方要填docker0的IP。

可以使用 ifconfig 命令来查看当前docker0的IP

以上就是Nuxt3项目部署的全部内容了。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/110635.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

jdk 03.stream

01.集合处理数据的弊端 当我们在需要对集合中的元素进行操作的时候,除了必需的添加,删除,获取外,最典型的操作就是集合遍历 package com.bobo.jdk.stream; import java.util.ArrayList; import java.util.Arrays; import java.ut…

乡村振兴战略下传统村落文化旅游设计书辉瑞

乡村振兴战略下传统村落文化旅游设计书辉瑞

新KG视点 | Jeff Pan、陈矫彦等——大语言模型与知识图谱的机遇与挑战

OpenKG 大模型专辑 导读 知识图谱和大型语言模型都是用来表示和处理知识的手段。大模型补足了理解语言的能力,知识图谱则丰富了表示知识的方式,两者的深度结合必将为人工智能提供更为全面、可靠、可控的知识处理方法。在这一背景下,OpenKG组织…

【VLDB 2023】基于预测的云资源弹性伸缩框架MagicScaler,实现“高QoS,低成本”双丰收

开篇 近日,由阿里云计算平台大数据基础工程技术团队主导,与计算平台MaxCompute团队、华东师范大学数据科学与工程学院、达摩院合作,基于预测的云计算平台资源弹性伸缩框架论文《MagicScaler: Uncertainty-aware, Predictive Autoscaling 》被…

深度学习之反卷积

具体推理可以参考https://blog.csdn.net/zhsmkxy/article/details/107073350

SpringBoot中间件ElasticSearch

Elasticsearch是一个基于 Lucene 的搜索服务器。它提供了一个分布式多用户能力的 全文搜索引擎 ,基于RESTful web 接口。 Elasticsearch 是用 Java 语言开发的,并作为 Apache 许可条款下的开放源码发布,是一种流行的企业级搜索引擎。Elastics…

【力扣每日一题】2023.8.24 统计参与通信的服务器

目录 题目: 示例: 分析: 代码: 题目: 示例: 分析: 题目顾名思义,要我们统计参与通信的服务器,给我们一个二维矩阵,元素为1的位置则表示是一台服务器。 …

ChatGPT Prompting开发实战(二)

一、基于LangChain源码react来解析prompt engineering 在LangChain源码中一个特别重要的部分就是react,它的基本概念是,LLM在推理时会产生很多中间步骤而不是直接产生结果,这些中间步骤可以被用来与外界进行交互,然后产生new con…

Leetcode 易错题整理(一)5. 7. 11. 15. 33. 34

5. 最长回文子串 给你一个字符串 s,找到 s 中最长的回文子串。 如果字符串的反序与原始字符串相同,则该字符串称为回文字符串。 示例 1: 输入:s "babad" 输出:"bab" 解释:"aba&q…

4. 池化层相关概念

4.1 池化层原理 ① 最大池化层有时也被称为下采样。 ② dilation为空洞卷积,如下图所示。 ③ Ceil_model为当超出区域时,只取最左上角的值。 ④ 池化使得数据由5 * 5 变为3 * 3,甚至1 * 1的,这样导致计算的参数会大大减小。例如1080P的电…

NVIDIA DLI 深度学习基础 答案 领取证书

最后一节作业是水果分类的任务,一共6类,使用之前学习的知识在代码段上进行填空。 加载ImageNet预训练的基础模型 from tensorflow import kerasbase_model keras.applications.VGG16(weights"imagenet",input_shape(224, 224, 3),include_t…

基于数据湖的多流拼接方案-HUDI实操篇

目录 一、前情提要 二、代码Demo (一)多写问题 (二)如果要两个流写一个表,这种情况怎么处理? (三)测试结果 三、后序 一、前情提要 基于数据湖对两条实时流进行拼接&#xff0…

Viobot基本功能使用及介绍

设备拿到手当然是要先试一下效果的,这部分可以参考本专栏的第一篇 Viobot开机指南。 接下来我们就从UI开始熟悉这个产品吧! 1.状态 设备上电会自动运行它的程序,开启了一个服务器,上位机通过连接这个服务器连接到设备&#xff0c…

面试现场表现:展示你的编程能力和沟通技巧

🌷🍁 博主猫头虎 带您 Go to New World.✨🍁 🦄 博客首页——猫头虎的博客🎐 🐳《面试题大全专栏》 文章图文并茂🦕生动形象🦖简单易学!欢迎大家来踩踩~🌺 &a…

成功项目风险预防可控的5个重点

成功的项目往往重视项目风险的预防和管控,这样有利于可能风险的及时控制和解决,将其不利影响降到最小。如果不重视对风险的预防和管控,不及时发现和处理项目风险,那么项目风险往往会为我们带来意想不到的不利后果,往往…

【IMX6ULL驱动开发学习】12.Linux SPI驱动实战:DAC驱动设计流程

基础回顾: 【IMX6ULL驱动开发学习】10.Linux I2C驱动实战:AT24C02驱动设计流程_阿龙还在写代码的博客-CSDN博客 【IMX6ULL驱动开发学习】11.Linux之SPI驱动_阿龙还在写代码的博客-CSDN博客 一、编写驱动 查看芯片手册,有两种DAC数据格式&a…

安防监控视频平台EasyCVR视频汇聚平台调用接口出现跨域现象的问题解决方案

视频监控汇聚EasyCVR可拓展性强、视频能力灵活、部署轻快,可支持的主流标准协议有GB28181、RTSP/Onvif、RTMP等,以及厂家私有协议与SDK接入,包括海康Ehome、海大宇等设备的SDK等,能对外分发RTSP、RTMP、FLV、HLS、WebRTC等格式的视…

08 通过从 库1 复制 *.ibd 到 库2 导致 mysql 启动报错

前言 呵呵 最近同事有这样的一个需求 需要将 库1 的一张表 复制到 库2 然后 我想到了 之前一直使用的通过复制这个库的 data 文件来进行数据迁移的思路, 是需要复制这个 库对应的 data 目录下的数据文件, 以及 ibdata1 文件 然后 我又在想 这里的场景能否也使用这里的额方式…

重生c++系列之类与对象(中篇)

好的继上期,我们今天带来c类与对象系列的继续学习。 类的6个默认成员函数 如果一个类中什么成员都没有,简称为空类。 空类中真的什么都没有吗?并不是,任何类在什么都不写时,编译器会自动生成以下6个默认成员 函数。 …

Hbase文档--架构体系

阿丹: 基础概念了解之后了解目标知识的架构体系,就能事半功倍。 架构体系 关键组件介绍: HBase – Hadoop Database,是一个高可靠性、高性能、面向列、可伸缩的分布式存储系统,利用HBase技术可在廉价PC Server上搭建起…