Управляйте многословностью веб-пакетов при программном запуске службы Vue-Cli-Service.

Question

Я пытаюсь запустить vue-cli-service serve из приложения Node.js следующим образом:

const Service = require('@vue/cli-service');
const service = new Service(process.cwd());
service.init("development");
service.run('serve').then(({ server, url }) => {
  console.log("started server on " + url);
});

И это работает.

$ node e2e.js
INFO  Starting development server...
40% building 130/136 modules 6 active ...node_modules/eslint-loader/index.js??ref--13-0!.../ui/src/js/config/Product.js...
. . .
. . .
started server on http://localhost:8080/

Но когда я делаю это вВ режиме production (измените service.init("development") на service.init("production")), я больше не вижу прогресса в "сборке" веб-пакетов.

$ node e2e.js
INFO  Starting development server...
started server on http://localhost:8080/

Отсюда мой вопрос: как запустить сервер Vue в производственном режиме, но сохраняете прогресс веб-пакета в консоли?

Answer 1

О прогрессе сообщает Webpack ProgressPlugin, который Vue CLI вставляет только для непроизводственных и не тестовых сборок (начиная с 3.x).

Вы можете включить этот плагин в <root>/vue.config.js с devServer.progress=true (в настоящее время недокументировано ):

module.exports = {
  devServer: {
    progress: true  // always show progress (even in production mode)
  }
}

Или в вашем e2e.js вы можете вставитьProgressPlugin в Service экземплярах webpackChainFns[] после init():

service.init("production")
service.webpackChainFns.push(config => {
  config
    .plugin("progress")
    .use(require("webpack/lib/ProgressPlugin"))
})