Vue配置服务器启动端口号

最新推荐文章于 2024-06-24 11:03:14 发布
最新推荐文章于 2024-06-24 11:03:14 发布
阅读量2.8k 收藏
点赞数
分类专栏： WebSan
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/milijiangjun/article/details/108006702
版权
本文介绍了如何在Vue项目中更改服务器启动的端口号。步骤包括打开项目中的config/index.js文件，修改ip、端口和自启动端口设置，处理错误覆盖和通知，最后通过npm install和npm run dev命令进行编译并查看运行效果。
摘要由CSDN通过智能技术生成

1 找到要更改的文件

打开我们的项目 打开config 中的index.js

在这里插入图片描述
更改需要更改的选项
ip
端口
是否自启动端口
错误覆盖：
通知错误：
自动打包
在这里插入图片描述
然后从新进行编译
在这里插入图片描述npm install
在这里插入图片描述npm run dev

看运行效果
在这里插入图片描述

milijiangjun
关注
专栏目录
Vue修改项目启动端口号方法
10-16
在Vue.js项目开发中，有时候由于多项目共存或者服务器端口冲突，我们需要自定义项目的启动端口号。本文将详细讲解如何在Vue项目中修改默认的启动端口号，以适应不同开发环境的需求。 首先，Vue项目的配置信息通常...
修改Vue项目运行的IP和端口
见证自己学习,成长的记录
02-09 7156
我们在使用VsCode启动Vue项目的时候，我发现：默认的端口号好像和tomcat一样，默认都是8080，如果8080被占用了，就会使用8081,8082这样的方式以此类推。那么，我们是否可以像后端一样，通过修改port属性的方式达到修改运行端口的方式呢？其实还是很简单的。这个vue.config.js和springboot的application配置文件是一个道理，需要修改项目什么东西就直接在里面改。注意语法就好啦！以后遇到其他的配置语法，会持续更新！
vue启动项目时指定端口的方法
热门推荐
Jeasu_0908的博客
01-20 1万+
vue启动项目时临时修改端口的方法 方法一：通过修改根目录下的vue.config.js配置文件 module.exports = { devServer: { port: 3000, // 端口 }, // lintOnSave: false // 取消 eslint 验证 } 方法二：通过vue项目启动命令 在这里插入代码片 ...
局域网内vue2 3 配置本地IP地址访问项目
m0_68716504的博客
06-24 1074
/在这句代码后面添加 --host 0.0.0.0" 如下messages: [ //下面两个地方，直接复制即可` - Local: http://localhost:${port}`, //配置这里` - Network: http://${require('ip').address()}:${port}`,//配置这里],},?}))
vue项目启动固定端口号
tsqjxy的博客
06-22 2086
1，在vue.config.js中配置，有一个port方法。代码如下： port该端口号。host能用ip访问页面。https协议。proxy代理。详细配置可看网站： 如果需要观看其他的配置选项：https://www.jianshu.com/p/b358a91bdf2d关于proxy的基本用法：https://www.jianshu.com/p/f489e7764cb8...
vue 指定启动端口 port devServer
焺爅
01-01 536
相关版本： 项目目录及需要修改的目标文件： 需要添加的内容（蓝色选中部分）：
修改vue运行的ip地址url以及端口port
我驾驶汽车从不是为了从A点到达B点，我喜欢去感受汽车，与之交流，与之融为一体。
05-20 446
修改以上两处即可。
Vue.js更改调试地址端口号的实例
10-18
除了更改端口号，`config/index.js`还包含其他配置项，如`autoOpenBrowser`（是否自动打开浏览器）、`assetsSubDirectory`（静态资源子目录）、`assetsPublicPath`（公共资源路径）和`proxyTable`（用于设置代理的...
vue.js如何更改默认端口号8080为指定端口的方法
12-10
Vue.js 是一个流行的前端...总之，更改Vue.js的默认端口号涉及修改`config/index.js`文件中的`port`配置，然后重启开发服务器。这个过程可以帮助开发者灵活地管理和配置自己的Vue项目，以适应不同的开发环境和需求。
Vue前后端不同端口的实现方法
10-17
总结，通过设置后端 CORS 头、在 Vue 中使用 Axios 发起请求、配置 Vue 代理以及分别启动前后端服务，我们成功实现了 Vue 和 Node.js 在不同端口上的通信。这个解决方案在开发阶段非常实用，但在部署时，通常需要在...
解决vue中使用proxy配置不同端口和ip接口问题
10-16
本文将详细介绍如何在Vue项目中使用proxy配置不同端口和IP接口的问题解决方法，包括代理配置的基本概念、配置方法以及部署到线上环境的注意事项。 ### Vue项目代理配置基础 在Vue CLI创建的项目中，通常会使用...
vue项目代理配置ip地址和端口号
m0_55918015的博客
01-19 1万+
在vue.config.js文件中，有几个嫌疑对象，port，host，target，一般host设置为0.0.0.0，大概就是自动匹配本机任意的ip地址，有啥用啥，感兴趣的可以自行搜索，这算是比较方便的写法，说是电脑手机都可以访问。port是本机的端口号，找一个能用的端口就行，像8080,90等等。 proxy里面的target就是代理，process是过程，就是项目启动的全局变量，process.env打印出来就是项目跑起来需要的环境，是一个环境变量，配合各种场景使用（应该是这么理解的吧too sad
vue 项目打包之后进行修改配置后端 IP 地址、端口等信息方法
CSDN_33901573的博客
05-11 9246
用vue-cli构建的项目通常是采用前后端分离的开发模式，也就是前端与后台完全分离，此时就需要将后台接口地址打包进项目中，但是，我们只是改个接口地址也要重新打包那就太麻烦了。怎么解决呢？方法如下，本文推荐俩种方式。
vue学习【四】之IP和端口配置
qq_35885429的博客
05-16 4001
默认的项目启动后访问localhost:8080 但是有时候你想自己配置这个东西，那么只需要在vue.config.js文件里配置就行，如果没有，自己新建一个。 内容如下 module.exports = { devServer: { disableHostCheck: false, host: "169.254.xx.xx", port: 8091, https: false, hotOnly: false,
npm run dev 启动vue的时候指定端口
ZHENGCHUNJUN的博客
01-18 3568
通过参数来指定 Vue CLI 的开发服务器使用的端口号。使用的是 Vue CLI 来创建和管理 Vue 项目，确保在命令行中正确输入命令，并替换成您想要的端口号。来指定启动的端口号。可以通过设置 --port。进入您的 Vue 项目目录。这样，您就可以在运行。
vue项目指定运行时占用的端口
weixin_45966674的博客
03-28 1525
正常情况下 我们启动vue项目 他会自动选择 http://localhost:8080/ 如果 8080被占用 他就会用 8081 然后再被占用就是8082 以此类推。这里 我们指定他运行在 82端口 当然 82被占用后 他也会去 83。我们可以在项目跟目录创建vue.config.js。vue.config.js参考代码如下。
vue开启network(IPv4地址)下的端口号
progrmmmm的博客
01-04 1424
需要打开根目录下build文件夹中webpackdev.conf.js。可以看到所需环境已配置完毕，所以只有脚手架2需要自己配置。需要打开根目录下config文件夹中的index.js文件。将localhost改为0.0.0.0，如下。并且下面的网址也可以打开项目。
vue2开启ipv4地址端口号
yrrjiayou的博客
09-19 346
vue2开启ipv4地址端口号
vue项目修改端口号
最新发布
09-10
在Vue项目中修改端口号通常涉及到项目的启动配置。大多数Vue项目是基于webpack来构建的，因此端口号可以在webpack配置文件中进行修改。如果你是使用Vue CLI创建的项目，可以通过修改`package.json`文件中的脚本来...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值