npm run dev 报错:getaddrinfo ENOTFOUND localhost和解决方法

报错情况

报错出现的情况:我的项目之前在本地执行npm run dev是可以成功运行的。在一次断网的情况下,执行了npm run dev,第一次出现报错,这时才意识到是断网了。等有网了重新执行npm run dev,报错依然出现。
报错信息:

Error: getaddrinfo ENOTFOUND localhost
    at errnoException (dns.js:50:10)
    at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:95:26)

具体截图:
clipboard.png

查了资料,大部分人简单的说是要修改hosts配置。但是对我这种弱鸡来说,我想知道,为什么会报错,而且要怎么修改host文件。。。

OK言归正传,这篇文章提到,根据报错内容,推断是localhost的问题。有可能是localhost没有绑定127.0.0.1,我就当是localhost没有绑定127.0.0.1吧,由于我在这方面的知识储备为0,所以我还是不太明白报错原因。

解决方法

1.打开hosts文件

终端执行:**sudo vim /etc/hosts**,打开hosts文件。

2.编辑hosts文件

按 **i** 进入编辑模式,如果你的hosts文件最后一行有 **0.0.0.0 account.xxx.xxx**,在这一行的上一行输入 **127.0.0.1 localhost**;没有,则在最后一行输入**127.0.0.1 localhost**。

3.保存hosts文件

按 **esc** 退出编辑模式,最后输入**:wq**,保存并退出(:(英文冒号)表示进入了底线命令模式,在底线命令模式下,q表示退出程序,w表示保存文件,所以:wq表示保存并退出,这里涉及到vim的简单使用,找度娘了解更多~)。

插曲

我在第一次打开hosts文件的时候,看到hosts文件已经有127.0.0.1 localhost,就以为localhost已经绑定127.0.0.1,闹了个乌龙。实际上 # 号那一行代表的是注释,好羞耻~
clipboard.png

至此,问题解决。有其他疑问可以在评论提出来,我们一起讨论,或者欢迎大神跟我详细讲一下报错的原因,谢谢大家~


Judy is studying
工作经历与学习经历分享

正在努力成为一名还不错的前端工程师

298 声望
10 粉丝
0 条评论
推荐阅读
JavaScript模块化简述
大部分人可能都大概了解以上代码的意思是 导入(引用) or 导出一些代码块。但是大家有没有想过,同样是导入、导出功能,为什么一个项目中常常能同时看到import和 require呢?他们又有什么区别的呢?要回答这些问...

猪猪猪惠婷阅读 1.3k

前端依赖管理那点事儿
主要内容📝 什么是依赖📤 依赖从哪来🤹 安装到哪儿🎥 版本控制🧑‍💻 哪些需要装,哪些不需要🎨 package-lock.json🛠 npm install 过程回顾什么是依赖有时候,依赖是一堆 可执行的代码 ;有时候,依赖只是 一句声明。1.当...

前端荣耀4阅读 734评论 2

封面图
想弄懂Babel?你必须得先弄清楚这几个包
相信很多人都知道Babel,知道它是用来编译ES6+的东西。但是再深入一点,大家都清楚我们平时项目中Babel用到的那些包作用是什么吗?为什么要用那几个包?

limingcan4阅读 1.2k

封面图
包管理工具:pnpm | 京东云技术团队
pnpm( performant npm )指的是高性能的 npm,与 npm 和 yarn 一样是一款包管理工具,其根据自身独特的包管理方法解决了 npm、yarn 内部潜在的安全及性能问题,在多数情况下拥有更快速的安装速度、占用更小的存...

京东云开发者3阅读 519

封面图
pnpm 之降本增效
主要影响:安装依赖包的过程,假如使用的是npm install会根据package-lock.json进行软件包的安装,如果没有package-lock.json会根据package.json进行生成并对安装的依赖包扁平化处理,安装依赖包的时长由两个因素...

京东云开发者2阅读 602

封面图
浅析 SplitChunksPlugin 及代码分割的意义
A: 最初,chunks(以及内部导入的模块)是通过内部webpack 图谱中的父子关系关联的。CommonsChunkPlugin曾被用来避免他们之间的重复依赖,但是不可能再做进一步的优化。从webpack v4 开始,移除了CommonsChunkPlu...

heweixiao2阅读 532

如何编写一个健壮的 npm 包 | 京东云技术团队
无脑发布 npm比如老王我,用npm init新建一个包,改把改把,然后来个npm publish,so easy ✌️!Too young too naive, baby 👶!请容我讲述一些发布过程中踩过的坑。首先,算了也可以之后有空再说,我们需要通读npm的...

京东云开发者3阅读 308

封面图

正在努力成为一名还不错的前端工程师

298 声望
10 粉丝
宣传栏