运行vite项目报错：Error: getaddrinfo ENOTFOUND localhost

于 2024-01-22 13:10:18 发布
阅读量828 收藏 9
点赞数 7
文章标签： 前端 服务器 运维
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/2301_76868945/article/details/135745646
版权
本文介绍了如何在Vite项目的vite.config.js文件中配置服务器，包括设置服务器主机地址为0.0.0.0，指定端口3000（自动处理端口占用），并启用热模块替换功能(HMR)以便实时刷新.
摘要由CSDN通过智能技术生成

解决：

在vite.config.js文件的defineConfig中添加

server:{
    host:'0.0.0.0',
    port:3000,//设置端口号，如果端口号已经被占用，vite将会使用下一个可用端口号
    hmr:true,//开启热更新
  }

成功运行：

一杯糯米兔兔
关注
  • 7
    点赞
  • 踩
  • 9
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
vue3配置代理--[vite] http proxy error_[vite] http proxy error
2401_84437095的博客
04-27 962
这样配置, 通用性更高一些。server: { // 中转服务器proxy: { // 通过代理实现跨域,搭理这个地址http://localhost:8081'/path': { // 路径, 作为就是替换域名target: 'http://127.0.0.1:8081', // 表示要替换的服务端地址changeOrigin: true, // 表示开启代理, 允许跨域请求数据secure: false, // 如果是https接口，需要配置这个参数。
vue 启动项目报 localhost 的错 getaddrinfo ENOTFOUND localhost
weixin_45132729的博客
12-02 3403
vue 启动项目报 localhost 的错 Error: getaddrinfo ENOTFOUND localhost at errnoException (dns.js:50:10) at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:95:26) 解决方法 打开 hosts 文件 终端执行：sudo vim /etc/hosts，打开 hosts 文件。复制代码 编辑 hosts 文件 按 i 进入编辑模式，如果你的 ho
error when starting dev server: Error: getaddrinfo ENOTFOUND localhost
qq_50386946的博客
11-09 778
先按 i 后，在最下面加上127.0.0.1 localhost。在终端输入：sudo vim /etc/hosts。再:wq ，再重启项目。
vue3配置代理--[vite] http proxy error
俗人世界
09-20 1万+
vue3配置代理,处理跨域, 出现报错的情况, --[vite] http proxy error
getaddrinfo ENOTFOUND
时光留不住，毕竟东流去
05-18 2939
getaddrinfo ENOTFOUND
vue 项目启动报错 getaddrinfo ENOTFOUND xxx
weixin_46610818的博客
05-22 1257
vue 项目启动报错 getaddrinfo ENOTFOUND xxx 启动项目报错 解决方法 打开 hosts 文件（windows）路径如下： C:\Windows\System32\drivers\etc 把报错的 xxx 路径 添加上就好了。
安装插件失败，getaddrinfo ENOENT raw.githubusercontent.com 报错
学而时习之，不亦说乎。
07-13 1万+
报错如图 解决方法： 查看raw.githubusercontent.com的真实IP地址 点开网址 https://www.ipaddress.com/ ，输入raw.githubusercontent.com，点击查询： 复制以下的ip 修改hosts文件 找到这个文件夹： C:\Windows\System32\drivers\etc 下的hosts 以管理员身份运行笔记本打开hosts，在最后一行编辑 185.199.108.133 raw.githubusercontent.com 185.
vite-app:看项目
03-21
Vite-App是一个基于Vite构建的前端应用模板，它为开发者提供了一个快速启动JavaScript项目的框架。Vite是由Vue.js作者尤雨溪开发的新型前端构建工具，它以速度快、热重载快以及原生支持ES模块而受到广泛关注。本文将...
vite-sample：vite示例项目
02-10
- **安装依赖**：在项目根目录运行 `npm install` 或 `yarn` 来安装所有依赖。 - **启动开发服务器**：使用 `npm run dev` 或 `yarn dev` 启动 Vite 开发服务器。 - **构建生产版本**：执行 `npm run build` 或 `...
vite-wallet:Vite桌面钱包
04-04
git submodule initgit submodule update安装安装依赖项yarn 安装vite-web-wallet的依赖项cd ../vite-web-wallet# Be sure you are in the folder of vite-web-walletyarn开发模式启动vite-web-wallet的本地开发...
vite-explorer：Vite的官方街区浏览器
02-05
Vite资源管理器 Vite的官方街区浏览器 有助于！ 要求 node.js 纱 开始 yarn 在编辑器中配置eslint，例如“ .eslintrc”之类的规则。 npm run dev 启动模拟服务器 npm run mock 分行 在分支“ dev / {version} / {...
vite-app:vite 构建 react vue vanilla 应用示例
05-09
本项目“vite-app”是使用 Vite 构建 React、Vue 和 Vanilla（原生JavaScript）应用的一个示例集合，旨在帮助开发者更好地理解和实践 Vite 的优点。 ### Vite 的核心特性 1. **快速启动**：Vite 使用了 ES 模块的...
使用vite搭建项目时，在启动vite后，浏览器显示页面：找不到localhost的网页
最新发布
nbvnvnvbn的博客
12-18 1573
在使用前端工具vite（版本5），搭建vue3项目时，启动vite，浏览器显示页面：找不到localhost的网页, 起初怀疑是 未加参数 --host='0.0.0.0',导致，后加上该参数后问题依旧
vue-cli 启动报错信息为getaddrinfo ENOTFOUND localhost
q1ngqingsky的博客
07-30 911
经查，发现package.json中dev的脚本变成了"webpack-dev-server --inline --host 0.0.0.0 --progress --config build/webpack.dev.conf.js"，使用了webpack-dev-server 出现此问题是因为webpack-dev-server启动时要指定ip，不能直接通过localhost启动， 解决方法： 修改config/index.js下dev配置中的host为ip：127.0.0.1（注意这里不能写成ht.
找不到 localhost 的网页找不到与以下网址对应的网页：http://localhost:5173/HTTP ERROR 404
xyfjx的博客
10-23 3777
起初认为是vite的配置问题 端口未设置 修改为8080端口后仍然无法访问。进一步推迟这个应该是访问html位置不对，找到文件一看，果然放错了。使用vite新建项目后，访问网址。修改位置准确即可，哎 太粗心了。
vue启动报错getaddrinfo ENOTFOUND x86_64-apple-darwin13.4.0
pot成长之路
03-18 1975
报错信息如下： npm run start > vocalprint@1.0.0 start /Users/mengzhichao/Desktop/cc/4pd/ie > npm run dev > vocalprint@1.0.0 dev /Users/mengzhichao/Desktop/cc/4pd/ie > webpack-dev-server --inline --progress --config build/webpack.dev.conf.js 10%
vue相关运行打包遇见的常见错误
github_38928905的博客
12-29 1609
运行： npm run dev 出现下面错This is probably not a problem with npm. There is likely additional logging output above. Error: listen EADDRNOTAVAIL 111.166.1.29:8081 at Object._errnoException (util...
【异常解决】vue项目localhost:8080无法访问此网站或者无法访问此页面，localhost拒绝了我们的连接请求
热门推荐
No8g攻城狮的博客
04-06 4万+
出现如图所示，8081端口被占用，且占用该程序的PID号为143132，接着【Ctrl + Alt + Delete】打开任务管理器，找到PID号为143132的进程，结束该进程，然后再重启服务项目即可。项目未成功启动，则需要查看前端项目为什么没有启动成功，这个原因复杂不再具体说明，可以试着重启服务项目，多重启几次。打开“我的电脑”，选择左上角的“计算机”中的“卸载或更改程序”。点击确定，然后浏览器验证，localhost已经可以访问了！（此处我查看的端口是8081，注意更换成自己的端口号）
接口请求时出现：Error: getaddrinfo ENOTFOUND xxx
weixin_44110034的博客
05-16 2万+
DNS 配置问题：如果您在局域网内，可能存在 DNS 配置问题。您可以尝试使用其他 DNS 服务器或联系网络管理员进行排查。这个错误通常发生在尝试访问某个主机或域名时，无法解析或找不到对应的 IP 地址。防火墙或代理设置：某些防火墙或代理服务器可能会阻止对特定主机或域名的访问，请确保您的防火墙或代理设置正确配置。主机名拼写错误：请确保您输入的主机名或域名正确无误，检查是否存在拼写错误。网络连接问题：请检查您的网络连接是否正常，确保您可以访问互联网。
vite项目报错：Uncaught ReferenceError: exports is not defined vue-router.esm-bundler
05-05
这个错误通常是因为你在使用 ES 模块语法时，没有使用 Babel 转换器将代码转换为浏览器可识别的语法。 在 Vite 项目中，你可以通过以下步骤解决此错误： 1. 安装 `@babel/plugin-transform-modules-commonjs` 和 `@babel/preset-env` 两个 Babel 插件。 ``` npm install --save-dev @babel/plugin-transform-modules-commonjs @babel/preset-env ``` 2. 在根目录下创建一个名为 `babel.config.js` 的文件，并添加以下内容： ```javascript module.exports = { presets: [ [ '@babel/preset-env', { targets: { chrome: '58', ie: '11' } } ] ], plugins: ['@babel/plugin-transform-modules-commonjs'] } ``` 这个配置文件将使用 `@babel/preset-env` 插件将代码转换为浏览器可识别的语法，并使用 `@babel/plugin-transform-modules-commonjs` 插件将 ES 模块语法转换为 CommonJS 模块语法。 3. 在 `vite.config.js` 文件中添加以下内容： ```javascript export default { esbuild: { jsxFactory: 'h', jsxFragment: 'Fragment' }, optimizeDeps: { include: ['@vueuse/core'] }, rollupInputOptions: { plugins: [ require('@rollup/plugin-commonjs')() ] } } ``` 这里我们使用 `@rollup/plugin-commonjs` 插件将 CommonJS 模块语法转换为 ES 模块语法，以便 Vite 可以正确处理它们。 重启 Vite 项目并再次尝试，应该就不会遇到这个错误了。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值