Can we use pm2 to start the development server of Vue cli?

Question

After creating a Vue project using vue cli, we can run it using

yarn run serve

I am not able to start using pm2. Running

pm2 start yarn -- run serve

I got a few crash-and-restart, after that, pm2 will stop to try to restart. In the log I can see

C:\PROGRAM FILES (X86)\YARN\BIN\YARN.CMD:1
(function (exports, require, module, __filename, __dirname) { @echo off
                                                              ^

SyntaxError: Invalid or unexpected token
    at new Script (vm.js:79:7)
    at createScript (vm.js:251:10)
    at Object.runInThisContext (vm.js:303:10)
    at Module._compile (internal/modules/cjs/loader.js:657:28)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10)
    at Module.load (internal/modules/cjs/loader.js:599:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
    at Function.Module._load (internal/modules/cjs/loader.js:530:3)
    at Object.<anonymous> (C:\Users\Utente\AppData\Roaming\npm\node_modules\pm2\lib\ProcessContainerFork.js:27:21)
    at Module._compile (internal/modules/cjs/loader.js:689:30)

I am running the pm2 command from the root of my project, where running yarn run serve works without problem

Montes

Answer 1

My solution

First, deleted all running pm2 instances

pm2 delete all

Then entered this configuration as ecosystem.js

module.exports = {
  apps: [
    {
      name: "WEB",
      script: "./node_modules/@vue/cli-service/bin/vue-cli-service.js",
      args: "serve"
    }
  ]
};

Note: vue server is already setup natively to do watching and reloading so do not add watch to pm2 settings otherwise the full dev server will be restarted, instead of doing the plain hot reload of vue-cli-service

Also: I suggest to install pm2-logrotate

Then restarted

pm2 start ecosystem.js

To follow logs simply use

pm2 logs

eventually adding the app name as argument to see only one log

Use case

I'm using this to work on a local smtp-catcher server and a webapp to read the catched email

Montes

This worked, thanks. I just changed the command a little bit, instead i am doing: pm2 start "/var/www/html/myapp/node_modules/.bin/vue-cli-service serve" --name “App Node JS" This way it worked - But is it a good practice? Is this the correct way to execute Vue server? – Partiality

Answer 2

Yes you can. pm2 start "npm run serve" --name <app name here>

Seay

This didnt work. – Partiality

Did you run the command with the app name as specified in package.json?...N.B: I did not generate the ecosystem file. I just ran the command as is. – Seay

Yes... I did run with the name specified in package,json but it didnt recognized. – Partiality

This worked perfectly, my command was pm2 start "npm run dev -- --host" --name <app name as mentioned in package.json> – Demise