在撰写本文时(2018年5月5日)，vue-cli的配置托管在<your_project_root>/vue.config.js。要更改端口，请参见以下内容:

// vue.config.js
module.exports = {
  // ...
  devServer: {
    open: process.platform === 'darwin',
    host: '0.0.0.0',
    port: 8080, // CHANGE YOUR PORT HERE!
    https: false,
    hotOnly: false,
  },
  // ...
}

vue.config.js的完整参考可以在这里找到:https://cli.vuejs.org/config/#global-cli-config

请注意，正如文档中所述，“webpack-dev-server的所有选项”(https://webpack.js.org/configuration/dev-server/)在devServer部分中可用。

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

运行服务-- --端口6058

第一选择:

打开的包。在“serve”部分中添加“——port port-no”。

就像下面，我已经做到了。

{
  "name": "app-name",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve --port 8090",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
}

第二个选项:如果你想通过命令提示符

运行NPM服务——端口8090

Vue-cli webpack模板的端口在你的应用根目录myApp/config/index.js中。

你所要做的就是在dev块中修改端口值:

 dev: {
    proxyTable: {},
    env: require('./dev.env'),
    port: 4545,
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    cssSourceMap: false
  }

现在你可以用localhost:4545访问你的应用了

如果你有。env文件，最好从那里设置

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

分别在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

如果你使用纱线:

yarn serve --port 3000