vue-cli-service serve --open启动项目时打开浏览器失效无法打开浏览器解决方法

当在vue项目中的package.json文件修改启动命令时,发现也无法自动打开浏览器。

  "scripts": {
    "serve": "vue-cli-service serve --open",
    "build": "vue-cli-service build"
  },

npm run serve --open

在命令上增加 --open也无法自动启动浏览器。

解决方法:

端口文件存放目录为:node_modules/@vue/cliservice/lib/commands/serve.js

根据以下代码修改:

   // create server
    const server = new WebpackDevServer(compiler, Object.assign({
      logLevel: 'silent',
      clientLogLevel: 'silent',
      historyApiFallback: {
        disableDotRule: true,
        rewrites: genHistoryApiFallbackRewrites(options.publicPath, options.pages)
      },
      contentBase: api.resolve('public'),
      watchContentBase: !isProduction,
      hot: !isProduction,
      injectClient: false,
      compress: isProduction,
      publicPath: options.publicPath,
      overlay: isProduction // TODO disable this
        ? false
        : { warnings: false, errors: true }
    }, projectDevServerOptions, {
      https: useHttps,
      proxy: proxySettings,
      // eslint-disable-next-line no-shadow
      before (app, server) {
        // launch editor support.
        // this works with vue-devtools & @vue/cli-overlay
        app.use('/__open-in-editor', launchEditorMiddleware(() => console.log(
          `To specify an editor, specify the EDITOR env variable or ` +
          `add "editor" field to your Vue project config.\n`
        )))
        // allow other plugins to register middlewares, e.g. PWA
        api.service.devServerConfigFns.forEach(fn => fn(app, server))
        // apply in project middlewares
        projectDevServerOptions.before && projectDevServerOptions.before(app, server)
      },
      // avoid opening browser
      open: true      ←//在这个地方,把open改为true
    }))

如果找不到在哪里,直接Ctrl+F查询open即可

 随后启动项目测试即可