vue中的端口号如何改修

2026-01-01 17:15:25 作者：大宁宁吖

文章介绍了两种在Vue项目中修改端口号的方法：一种是在`webpack.config.js`或`vue.config.js`中配置`devServer`,另一种是修改`package.json`中的`scripts`属性,在`serve`或`dev`命令后加上`--port`指定端口号

vue端口号改修

在根目录webpack.config.js或vue.config.js中配置devServer

module.exports = {
  devServer: {
    host: 'localhost',
    port: 9000, // 端口
  }
}

在package.json中的scripts进行配置

若项目是用cli3+版本创建则在serve的属性值后加上--port 9000，若是用cli2创建的项目则在dev的属性值后加上--port 9000。

如下：

"serve": "vue-cli-service serve --port 9000",

配置完重新运行项目即可

运行效果如下：

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。