vue npm run serve 启动服务 ip访问报错

最新推荐文章于 2024-04-26 17:54:13 发布
最新推荐文章于 2024-04-26 17:54:13 发布
阅读量2.6k 收藏 8
点赞数
分类专栏： webpack  vue javascript 文章标签： vue.js npm javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_37299479/article/details/127103335
版权
javascript 同时被 3 个专栏收录
20 篇文章 0 订阅
订阅专栏
vue
19 篇文章 0 订阅
订阅专栏
webpack 
2 篇文章 0 订阅
订阅专栏

vue 项目

问题：npm run serve 启动服务后，可以使用localhost 和 127.0.0.1 都可以访问，但是使用ip地址无法访问，如何解决？

第一种解决方式：修改package.json  serve 配置 

弊端：修改完后，ip可以访问了，但是localhost 和127 访问不了了

 

 修改 package.json中的serve命令这一行加一个参数  --host 172.16.4.35

 修改完配置文件，重新执行 npm run serve

 实现了ip可以访问，但是这时，localhost 和127 访问不了了

第二种方式：修改vue.config.js

 大功告成，所有【localhost ,127, ip地址】都可以访问了！！！

半个开心果
关注
  • 0
    点赞
  • 踩
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue 利用高德地图的巡航轨迹， 做带进度条和倍速的轨迹回放demo，npm run serve启动，npm install安装
02-03
vue 利用高德地图的巡航轨迹， 做带进度条和倍速的轨迹回放demo，npm run serve启动，npm install安装依赖，默认端口打开即可见
Vue项目启动后用局域网不能访问
分享自己的经验、IT技术，愿在博客中遇见更好的自己
12-08 1447
今天来解决一个问题：基于Vite构建的Vue项目在启动后只能通过localhost这种形式访问，但 如果把localhost换成本主机的局域网ip地址之后页面无法访问了。
当Vue项目启动后，通过IP地址方式在相同网络段的其他电脑上无法访问前端页面？
舒一笑的博客
02-26 879
默认情况下，许多开发服务器（如Vue CLI的）只监听localhost（127.0.0.1），这意味着它们只能接受来自本机的连接。为了使其能够接受来自网络上其他设备的连接，需要配置服务以监听所有网络接口（0.0.0.0）。：Windows或其他操作系统的防火墙可能阻止了对应用程序使用的端口的访问。如果服务正在运行，但其他设备无法连接，可能需要配置防火墙以允许外部设备访问该端口。：确保所有设备都连接到同一网络，并且没有子网或VPN配置阻止它们之间的通信。
ConnectionStrings VUE的helloworld项目1 运行命令 npm run serve
05-07
ConnectionStrings VUE的helloworld项目1 运行命令 npm run serve
腾讯云服务器ping不通解决方法（公网IP/安全组/系统多维度）
gla2018的博客
05-28 1628
腾讯云服务器ping不通什么原因？ping不通公网IP地址还是域名？新手站长从云服务器公网IP、安全组、Linux系统和Windows操作系统多方面来详细说明腾讯云服务器ping不通的解决方法：
彻底解决公网ip无法访问服务器的问题
小清华的小哥哥
12-06 1874
用服务器的公网ip访问突然提示页面无法访问了，之前还是ok的： 步骤1. 检查服务地的安全组规则是否有添加80端口映射，如果没有需要手动添加，检查了一下是有的： 步骤2. 检查服务器防火墙入站规则里面是否添加了80端口，否则访问会被拦截，经过检查果然是防火墙的问题，手动添加后，使用公网ip就可以正常访问了：
Vue dev 项目局域网访问
sjpeter的专栏
07-22 1595
打开项目根目录的 package.json，然后找到scripts，如果你是希望在 npm run dev 的时候 内网可以方访问，那么你再 scripts下的dev 结尾增加一个参数--host 192.168.0.123 就可以了 替换你的本机ip 完整的例子 "scripts": { "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --host 10.158.4.156",
veu npm run dev指定host
weixin_30485291的博客
09-10 1577
通常，我们可以在vue项目中的config/index.js指定host,，如下（解host的注释） 但是，在接手的目前项目中，解注释host后，npm run dev并有变为 http://192.168.43.230:8087，依然是http://localhost:8087 经过一番查找，发现要在build/dev-server.js文件中配置，如下。 ...
Vite启动后提示“Network: use `--host` to expose“，且无法通过网络IP访问服务
热门推荐
勇敢阿呆的部落阁
07-21 3万+
目录 起因 问题重现 问题原因 解决方法 1. 修改 vite.config.js 配置 2. 通过 Vite CLI 配置 3. 修改 npm 脚本 起因 当使用 Vite 构建项目后，需要通过局域网中的电脑或手机访问服务调试时，发现通过 IP + 端口无法访问。 问题重现 当运行 npm run dev | serve 命令时，会显示一下内容。 > vite-vue@0.0.0 serve /Users/UserName/Workspace/vue-vite > vite |
[vue]npm run dev只能localhost访问的解决方法
weixin_33889245的博客
11-28 1940
2019独角兽企业重金招聘Python工程师标准>>> ...
在云服务器使用“npm run dev“启动node.js项目，外网无法访问
weixin_57220119的博客
07-24 1072
然后找到 dev 下的host, 改为 0.0.0.0 ,表示接收所有ip地址的请求。
解决vue项目运行npm run serve报错的问题
01-18
先来一张报错的截图 先去配置环境变量 C:\Users\lgd\AppData\Local\Programs\Microsoft VS Code\bin的后面配置 ；%SystemRoot%\system32;...补充知识：vue npm run serve报错Cannot find module ‘eslint-plugin
vue3项目，带增删改，连带node_modules包，下载后运行npm run serve启动
06-14
vue3项目，带增删改，连带node_modules包，下载后运行npm run serve启动,如果依赖安不上npm i --legacy-peer-deps npm i eslint-plugin-vue，再npm run serve
运行 npm run dev 报错
01-20
刚刚创建好vue项目的时候,运行 npm run dev 会报错,如下: C:\Users\未来\Desktop\新建文件夹 (2)>npm run dev npm ERR! path C:\Users\未来\Desktop\新建文件夹 (2)\package.json npm ERR! code ENOENT npm ERR! ...
vue快速入门（四十六）Router的安装与使用
不起眼小菜菜的博客
04-26 631
步骤很详细，直接上教程……
Vue项目中异步组件的引入使用
最新发布
Niucode的博客
04-26 262
Vue项目中异步组件的引入使用
vue echarts 柱状图 堆叠柱状图
Z18834071903的博客
04-26 285
vue echarts 柱状图 堆叠柱状图
vue3组件 描点定位以及监听滚动切换对应activeTab
weixin_41824429的博客
04-26 353
【代码】vue3组件 描点定位以及监听滚动切换对应activeTab。
vue实现录音并转文字功能，包括PC端web，手机端web
byebukesi的博客
04-26 496
不止vue，不限技术栈，vue2、vue3、react、.net以及原生js均可实现。
vue npm run serve报错
06-28
### 回答1： 当您在运行Vue项目时，如果出现“npm run serve”报错，可能是以下原因之一： 1. 您的项目中缺少依赖项，您需要使用“npm install”命令安装缺少的依赖项。 2. 您的项目中的某些文件可能已被删除或移动，您需要检查并修复这些问题。 3. 您的项目中可能存在语法错误或其他代码问题，您需要检查并修复这些问题。 4. 您的计算机可能存在其他问题，例如网络连接问题或权限问题，您需要检查并修复这些问题。 如果您无法解决问题，请尝试在Vue社区或其他技术论坛上寻求帮助。 ### 回答2： Vue是一款流行的前端开发框架，npm是Node.js的包管理工具，通过npm安装的Vue一般不包含编译后的代码，需要使用Vue提供的命令行工具来编译和运行Vue应用。其中，npm run serve是用来运行本地开发服务器的命令，如果在执行npm run serve命令时遇到报错，可能有以下原因： 1. 端口占用 npm run serve默认使用8080端口，如果该端口已被占用，就会出现报错。可以尝试修改端口号，例如修改为8081，命令为npm run serve -- --port 8081。 2. 缺少依赖包 Vue应用需要依赖很多包，如果其中任意一个包不存在或者版本不匹配，就会出现报错。这时可以尝试删除node_modules目录，然后重新安装依赖包，命令为npm install。 3. 代码错误 Vue应用开发的代码中可能存在语法错误、逻辑错误等问题，导致编译失败或者运行时出错。此时需要仔细检查代码并修复错误。 4. 配置错误 Vue应用的配置文件（例如vue.config.js）可能存在配置错误，导致编译或者运行时出错。此时需要仔细检查配置文件并修复错误。 总之，当出现npm run serve报错时，需要认真查找报错信息，找出具体原因，然后根据原因逐一解决。同时，也要及时备份代码和配置文件，避免因操作失误导致数据丢失。 ### 回答3： 在Vue中使用npm run serve命令启动项目时，可能会遇到各种报错。这些错误可能是基于环境的，也可能是代码的问题。下面是几种常见的情况及其解决方法： 1. "Error: listen EADDRINUSE: address already in use" 这个错的意思是该端口号已被占用，你需要换个端口号来启动。方法是修改"package.json"文件中的scripts，将命令 "serve": "vue-cli-service serve" 修改为 "serve": "vue-cli-service serve --port xxxx"，xxxx为新的端口号。 2. "Error: Cannot find module '@vue/cli-service/lib/config/base'" 这个错误通常是因为缺失@vue/cli-service包导致的。运行"npm install -D @vue/cli-service"命令，安装这个包即可修复。 3. "TypeError: Cannot read property 'requestHandler' of undefined" 这个错误往往是由于typescript错误而导致的。要修复这个问题，您需要在vue.config.js中设置compilerOptions。 4. 其他错误 如果出现其他错误，您首先需要检查代码是否有误，确认是否误删了某个文件或其它文件格式问题。如果代码没有问题，你可以运行"npm cache clean --force" 清除本地的npm缓存，再重新安装npm包。如果依然无法解决，你可以考虑重新生成项目即可。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值