Vue修改项目启动端口号

Vue项目启动时默认端口号是8080，如果要启动多个项目就会发生冲突，通过以下方式可修改默认端口号

更多精彩

• 更多技术博客，请移步 asing1elife’s blog

在项目的package.json中可以找到如下代码

• start属性指定的文件就是通过开发模式启动的服务文件

"scripts": {
  "dev": "node build/dev-server.js",
  "start": "node build/dev-server.js",
  "build": "node build/build.js",
  "lint": "eslint --ext .js,.vue src"
}

在build目录下的dev-server.js中可以找到如下代码

• 可以发现uri在拼接port接口之前，port接口首先根据是生产还是开发，被赋予了不同的端口号
• 而开发环境下的端口号来自config目录

var config = require('../config')
...
var port = process.env.PORT || config.dev.port
...
var uri = 'http://localhost:' + port

在config目录下的index.js中可以找到如下代码

• 修改此处的port即可修改开发环境下启动项目的端口号

dev: {
	...
  port: 8090,
	...
}