修罗

nuxt3打包项目
1. 打包项目方式一:yarn generate 打包的时候会请求后台生成首屏的数据,后台数据发生改变要重新打包,...
扫描右侧二维码阅读全文
15
2023/03

nuxt3打包项目

1. 打包项目

  • 方式一:
yarn generate 

打包的时候会请求后台生成首屏的数据,后台数据发生改变要重新打包,并只有首屏数据是静态的,翻页依然请求后台数据。使用generate打包和使用vue打包一样,生成一个dist文件夹。当成静态页面部署即可。一般不会考虑这种打包方式

  • 方式二:
npx nuxi build / yarn build

image-20230315145326864.png

2. 打包目录下创建package.json

通过cross-env设置环境变量,可以很好地适配多个平台,无需根据平台来设置相对应的变量

image-20230315145523769.png

{
  "private": true,
  "scripts": {
    "start": "cross-env PORT=5000 HOST=localhost node ./server/index.mjs"
  },
  "dependencies": {
    "cross-env": "^7.0.3"
  }
}

3. 打包目录下运行安装

npm install

image-20230315145626017.png

4. 启动项目

打包目录下执行

npm start

image-20230315145950824.png

此时可通过http://127.0.0.1:5000访问项目。

5. 使用pm2启动

1,在服务器中安装PM2;

2,将打包目录上传到服务器中;

这里是在centos7中部署,打包目录下执行:

pm2 start npm -- start

image-20230315160553085.png

我使用的node和pm2的版本

image-20230315160726057.png

Last modification:March 20th, 2023 at 10:43 am

Leave a Comment