Vite 启动默认只能访问localhost解决方法

最新推荐文章于 2024-05-29 08:59:01 发布
最新推荐文章于 2024-05-29 08:59:01 发布
阅读量841 收藏 1
点赞数 3
分类专栏： 常见问题及应对措施 文章标签： 服务器 linux 前端 vite vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_30817059/article/details/134478328
版权

事情的经过是因为我需要测试本地项目的接口,然后因为burp默认不抓取localhost,127.0.0.1 .而且我也不想去修改burp. 所以我通过本地IP地址访问项目, 发现项目无法访问。

默认启动
在这里插入图片描述

在这里插入图片描述

所以特此记录一下。

在本地项目的package.json 中需要运行的脚本后 添加 --host即可。
具体如下.
在这里插入图片描述
重新启动
在这里插入图片描述然后浏览器访问即可.然后要注意前后端分离项目 跨域的问题。

在这里插入图片描述

SwBack
关注
  • 3
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
vue项目启动出现cannot GET /服务错误的解决方法
11-21
在网上查了一堆，发现这个问题还挺多呢，而且各个回答的解决方式都竟然有许多不同… 于是把能改的地方都改了…（基本上相当于将配置信息改回来） 关闭 history 模式 关闭history模式，用/#/路由的方式开启，...
vite-plugin-restart:自定义文件组重新启动Vite服务器
03-25
自定义文件/全局文件以重新启动Vite服务器 用法 安装 npm i vite-plugin-restart -D # yarn add vite-plugin-restart -D 将其添加到vite.config.js // vite.config.js import ViteRestart from 'vite-plugin-...
vite创建vue项目启动时域名为127.0.0.1修改为localhost不生效——问题解决
yehaocheng520的博客
04-28 687
vite创建vue项目启动时域名为127.0.0.1修改为localhost不生效——问题解决
vite 使用本地 ip + localhost 访问服务
来杯卡布奇诺的博客
10-17 2860
如果配置了 server.host 的值为 0.0.0.0，静态资源服务将以 localhost 和本地 Ip 进行启动，此时我们可以通过 localhost:port 或 127.0.0.1:port 或localIp:port 进行应用访问。在 vite.config.js 中，如果未配置 server.host，默认服务将以 localhost 进行启动，此时我们可以通过 localhost:port 或 127.0.0.1:port 进行应用访问。
vite开发服务器server选项配置（2024-05-29）
最新发布
hap1994的博客
05-29 1781
这在使用自签证书或想通过网络在某端口暴露 Vite 的情况下，非常有用。是一个高级选项，只在客户端的情况下覆盖端口，这允许你为 websocket 提供不同的端口，而并非在客户端代码中查找。注意：如果端口已经被使用，Vite 会自动尝试下一个可用的端口，所以这可能不是开发服务器最终监听的实际端口。来禁用此行为，或者为了获得完全的控制，可以传递一个函数，该函数接受源路径和 sourcemap 的路径，并返回是否忽略源路径。时，浏览器使用 DNS 来解析地址，这个地址可能与 Vite 正在监听的地址不同。
vite创建vue项目启动时端口号为127.0.0.1修改为localhost
qq_46580571的博客
08-07 7618
vite创建vue项目修改端口号为localhost
vite+vue3项目修改启动的端口号为localhost
世间万物皆不如你
08-01 8180
找到vite.config.ts文件在里面进行修改。
vite运行只能访问localhost解决办法(Network: use --host to expose)
weixin_61570458的博客
09-27 2490
【代码】vite运行只能访问localhost解决办法(Network: use --host to expose)
vite项目运行后是主机地址的解决方案
qq_48666244的博客
09-06 523
时，浏览器使用 DNS 来解析地址，这个地址可能与 Vite 正在监听的地址不同。当地址不一致时，Vite 会打印出来。Node.js 在 v17 以下版本中默认会对 DNS 解析地址的结果进行重新排序。开发服务器选项 | Vite 官方中文文档 (vitejs.cn)这是因为侦听非通配符主机的服务器优先于侦听通配符主机的服务器。来禁用这个重新排序的行为。Vite 将会将改地址打印为。在某些情况下，可能响应的是其他服务器而不是 Vite。第二种情况是使用了通配主机地址（例如。
解决VUE项目localhost端口服务器拒绝连接,只能用127.0.0.1的问题
10-14
主要介绍了解决VUE项目localhost端口服务器拒绝连接,只能用127.0.0.1的问题
vue-cli启动本地服务局域网不能访问的原因分析
01-19
 本地vue-cli启动了一个项目只能通过localhost:8080访问到，同一局域网下其他的手机和电脑并不能通过ip地址访问调试， 2.原因：vue-cli项目是通过命令行一键生成的，配置文件中默认生成的是本地调试模式，默认访问...
vite+vue3使用localhost访问接口报错 500
zhangyuea的博客
03-15 1688
用ip访问这个接口是可以通的 但是用localhost访问就报500或者200但不返回东西，原因就是代理少了个配置 secure: false, // 跳过https验证。
Vite内网ip访问，两种配置方式
前端蜗牛君
02-21 7450
方式一：修改vite的配置文件（vite.config.ts）方式二：修改package.json文件。运行项目的时候，控制台会只出现。采用上面任一方式，就可以通过。
使用vite搭建项目时，在启动vite后，浏览器显示页面：找不到localhost的网页
nbvnvnvbn的博客
12-18 1548
在使用前端工具vite（版本5），搭建vue3项目时，启动vite，浏览器显示页面：找不到localhost的网页, 起初怀疑是 未加参数 --host='0.0.0.0',导致，后加上该参数后问题依旧
基于react、vite搭建项目遇到的坑
coco723的博客
03-17 408
检查您的hosts文件是否正确配置。您可以在计算机上搜索“hosts”文件并打开它，然后检查是否有任何条目将“localhost”映射到错误的IP地址。如果您使用代理服务器，可以尝试禁用它并重启开发服务器，以查看是否解决了问题。确保您的本地DNS配置正确。您可以尝试使用其他网络连接或在本地网络配置中更改DNS服务器。从控制台可以看出这个错误通常是由于本地DNS配置问题导致的。尝试在开发服务器的配置中使用IP地址而不是“localhost”。一步步检查下来，按第4点，问题得以解决；当启动本地服务的时候；
vite：配置ip访问
热门推荐
分享前端开发工程师的一些日常生活、前端知识点、职业发展、对一些问题的看法、感悟等等
02-15 1万+
背景 默认情况下 vite 不允许通过 ip 地址访问，只能通过 localhost。 修改 只需要修改 vite.config.ts，将 host 改为 0.0.0.0 server:{ host: '0.0.0.0', } 改完就可以看到了。 改 vite 配置不需要重启服务哦~ 官方文档介绍： 参考资料 官方文档 ...
Vite 源码（五）浏览器访问 `localhost:3000/` 时，Vite做了什么
自己整理的一些前端知识
12-24 444
theme: cyanosis highlight: monokai 在之前几篇文章中我们知道了Vite 的启动过程。当我们执行yarn run dev之后，Vite 会初始化配置项、预构建、注册中间件，并启动一个服务器。之后就不会再进行其他操作，直到我们访问localhost:3000/ 当我们访问localhost:3000/时，会通过中间件拦截文件请求，并处理文件，最终将处理后的文...
vite跨域问题，你可能需要看这篇文章
Hi_alan的博客
05-13 1359
这篇文章帮助你解决vite启动127.0.0.1,出现跨域。request.getSeesison().getAttribute()拿不到值，localhost和127.0.0.1的区别，Chrome SameSite如何解决
vite创建vue3项目修改默认端口
08-28
要在Vite中创建一个Vue 3项目并修改默认端口，您可以按照以下步骤进行操作： 1. 首先，确保您已经安装了最新版本的Node.js和npm。 2. 打开命令行工具，并进入您想要创建项目的目录。 3. 运行以下命令来全局安装Vite： ``` npm install -g create-vite ``` 4. 等待安装完成后，运行以下命令来创建一个新的Vue 3项目： ``` create-vite <project-name> ``` 注意：将 `<project-name>` 替换为您想要为项目指定的名称。 5. 进入新创建的项目目录： ``` cd <project-name> ``` 6. 现在，您可以通过运行以下命令来启动开发服务器： ``` npm run dev ``` 默认情况下，Vite会使用 localhost:3000 的端口。 7. 要修改默认端口，您可以在项目根目录下创建一个名为 `vite.config.js` 的文件，并将以下内容添加到文件中： ```javascript module.exports = { server: { port: <your-port-number> } } ``` 将 `<your-port-number>` 替换为您想要使用的端口号。 8. 保存并关闭 `vite.config.js` 文件。 9. 重新启动开发服务器，以使更改生效。 现在，您应该能够在指定的端口上访问您的Vue 3项目了。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

SwBack

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值