美文网首页
nuxt+pm2部署,解决nuxt异常缓慢的问题

nuxt+pm2部署,解决nuxt异常缓慢的问题

作者: 野马关 | 来源:发表于2021-04-25 17:42 被阅读0次

部署到线上后,发现nuxt异常缓慢

一检查network,发现有10M+的js包?

没错,你部署失败了。

不妨本地尝试一下

nuxt build
nuxt // 1
nuxt start // 2

这两个命令的差异,不难看出

  • 模式1是调试模式,会加载所有js,包的体积很大,很慢
  • 模式2是服务模式,仅会加载部分js,包的体积很小,速度很快

那么,为什么本地没问题,pm2部署后就会进入模式1呢?
很简单

pm2 start
pm2 start xx.js

这两种模式可能都会进入模式1,主要是因为没有携带start参数,直接启动了nuxt
那么要怎么加上呢
在命令行中,可以增加

pm2 start -- start

-- 后的内容会被原样传递给调用的js,这里调用了哪个js文件呢?
我们可以在ecosystem.config.js中找到
一般它的内容为:

// 错误的配置文件
module.exports = {
    "apps": [{
        "name": "test-frontend",
        "script": "./server/index.js",
        "watch": false,
        "env": {
            "NODE_ENV": "production"
        },
        "env_dev": {
            "NODE_ENV": "development"
        }
    }]
}

script即pm2调用的脚本,
所以,首先要将这里替换为./node_modules/nuxt/bin/nuxt.js
也可以替换为npm run start
记得核对你package.json里的命令
这两种方式,第二种会导致pm2日志有误,所以推荐第一种。

除了script,解决加载慢的关键参数来了,start要放在哪里呢
答案是,args

args: 'start'

但是,重点来了,假设你用到了环境区分scriptargs放在上面是无效的
必须放在下面
所以整个配置文件是这样的

// 正确的配置文件
module.exports = {
    "apps": [{
        "name": "test-frontend",
        "script": "./node_modules/nuxt/bin/nuxt.js",
        "args": 'start',
        "watch": false,
        "env": {
            "NODE_ENV": "production",
            "script": "./node_modules/nuxt/bin/nuxt.js",
            "args": 'start'
        },
        "env_dev": {
            "NODE_ENV": "development",
            "script": "./node_modules/nuxt/bin/nuxt.js",
            "args": 'start'
        }
    }]
}

启动命令是这样的

pm2 start ecosystem.config.js --env dev

整个过程,官方文档并没有指引,所以还是比较坑的
如果这篇文章帮助了你,留个评论再走

相关文章

网友评论

      本文标题:nuxt+pm2部署,解决nuxt异常缓慢的问题

      本文链接:https://www.haomeiwen.com/subject/twadrltx.html