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

  • Post author:
  • Post category:vue



当在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即可


随后启动项目测试即可



版权声明:本文为weixin_43140084原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。