如果你想临时改变端口号，你可以在npm run serve命令中添加一个-port选项。

运行服务-- --端口6058

进入“node_modules/@vue/cli-service/lib/options.js”目录 在“devServer”的底部，解锁代码 现在在“port”中给出你想要的端口号:)

devServer: {
   open: process.platform === 'darwin',
   host: '0.0.0.0',
   port: 3000,  // default port 8080
   https: false,
   hotOnly: false,
   proxy: null, // string | Object
   before: app => {}
}

这里有很多不同版本的答案，所以我想我应该在2018年10月使用Vue CLI时确认并阐述Julien Le Coupanec的答案。在Vue.js的最新版本(vue@2.6.10)中，在浏览了这篇文章中无数的答案后，下面概述的步骤对我来说最有意义。Vue.js文档引用了这个难题的各个部分，但不是很明确。

打开包裹。Vue.js项目根目录下的Vue.js文件。 在包中搜索“port”。json文件。 在找到以下对“port”的引用后，使用如下所示的相同语法，编辑serve脚本元素以反映所需的端口: "脚本":{ “serve”:“vue-cli-service serve—port 8000”， "build": "vue-cli-service build"， "lint": "vue-cli-service lint" ｝ 确保重新启动npm服务器以避免不必要的疯狂。

文档显示，通过在npm run serve命令的末尾添加——port 8080，可以有效地得到相同的结果，如下所示:我更喜欢编辑这个包。直接编辑NPM run serve——port 1234以避免额外的输入，但是内联编辑NPM run serve——port 1234可能对一些人有用。

如果你想临时改变端口号，你可以在npm run serve命令中添加一个-port选项。

运行服务-- --端口6058

虽然有点晚了，但我认为将所有这些答案整合成一个概述所有选项的答案是有帮助的。

分别在Vue CLI v2 (webpack模板)和Vue CLI v3中，按优先级(从高到低)排序。

Vue CLI v3

package.json: Add port option to serve script: scripts.serve=vue-cli-service serve --port 4000 CLI Option --port to npm run serve, e.g. npm run serve -- --port 3000. Note the --, this makes passes the port option to the npm script instead of to npm itself. Since at least v3.4.1, it should be e.g. vue-cli-service serve --port 3000. Environment Variable $PORT, e.g. PORT=3000 npm run serve .env Files, more specific envs override less specific ones, e.g. PORT=3242 vue.config.js, devServer.port, e.g. devServer: { port: 9999 }

引用:

https://cli.vuejs.org/config/#devserver https://cli.vuejs.org/config/#vue-config-js https://cli.vuejs.org/guide/mode-and-env.html

Vue CLI v2(已弃用)

环境变量$PORT，例如:PORT=3000 / config / index.js: dev.port

引用:

http://vuejs-templates.github.io/webpack/ https://github.com/vuejs-templates/webpack/blob/develop/template/build/webpack.dev.conf.js#L35

如果您使用vue-cli 3。X，你可以简单地将端口传递给NPM命令，如下所示:

运行服务-- --端口3000

然后访问http://localhost:3000/