vue项目配置同一局域网可使用ip访问的操作


Posted in Javascript onOctober 23, 2020

1、检查 package.json文件,scripts.dev设置 host改成 "0.0.0.0"

vue项目配置同一局域网可使用ip访问的操作

2、config文件中找到 index.js 文件的host改成 "0.0.0.0"

vue项目配置同一局域网可使用ip访问的操作

此处的"0.0.0.0"可以改成自己的ip,重启项目就可以了

补充知识:@vue/cli创建项目报错ERROR Failed to get response from /vue-cli-version-marker的解决方案

今天他们遇到一个很有意思的bug,用@vue/cli创建项目的时候报错了,还是个从来没见过的报错:

vue项目配置同一局域网可使用ip访问的操作

一开始以为是版本问题,毕竟报错信息上写着update,但是cli的版本是最新的,而且询问之后,node和npm版本也是最新的(12.16.1,截止我写这篇文章的时候是最新的);最要命的是,也没有老版本的vue-cli……

这就非常有意思了。按照惯例,遇到前端的问题,第一反应就是卸载重装,一套操作行云流水:

npm uninstall -g @vue/cli
npm cache clean --force
npm install -g @vue/cli

然而并没有什么用,查了半天网上也找不到相关的报错,这就很尴尬了。

后来我注意到下面有个yarn的输出,难道cli内建的是yarn?但是这不应当:

vue项目配置同一局域网可使用ip访问的操作

虽然觉得很不可思议,但我还是决定看看yarn的版本,yarn有重大嫌疑。果然:

vue项目配置同一局域网可使用ip访问的操作

问题找到了。但是这是啥?Hadoop?

后来才想起来,yarn同时也是Hadoop的一部分,用来调度资源的:

vue项目配置同一局域网可使用ip访问的操作

从环境变量里移除Hadoop的yarn之后,就能正常创建项目了。

但是我还有一个问题没有解决,为什么cli会使用yarn?我这里的cli用的是npm啊。对比~/.vuerc之后,发现我这里的配置是这样的:

{
 // ...
 "packageManager": "npm"
}

他那里的配置是:

{
 // ...
 "packageManager": "yarn"
}

后来听他说,他第一次安装cli的时候,好像选的是yarn……

以上这篇vue项目配置同一局域网可使用ip访问的操作就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JS 判断代码全收集
Apr 28 Javascript
javascript获取select的当前值示例代码(兼容IE/Firefox/Opera/Chrome)
Dec 17 Javascript
jquery选择器之层级过滤选择器详解
Jan 27 Javascript
js实现的标题栏新消息闪烁提示效果
Jun 06 Javascript
简单谈谈javascript中this的隐式绑定
Feb 22 Javascript
JavaScript之RegExp_动力节点Java学院整理
Jun 29 Javascript
Express + Node.js实现登录拦截器的实例代码
Jul 01 Javascript
vue-router 手势滑动触发返回功能
Sep 30 Javascript
vue-router两种模式区别及使用注意事项详解
Aug 01 Javascript
Vue指令之 v-cloak、v-text、v-html实例详解
Aug 08 Javascript
解决layer 关闭当前弹窗 关闭遮罩层 input值获取不到的问题
Sep 25 Javascript
微信小程序 行的删除和增加操作实现详解
Sep 29 Javascript
Vue表单提交点击事件只允许点击一次的实例
Oct 23 #Javascript
利用PHP实现递归删除链表元素的方法示例
Oct 23 #Javascript
如何在面试中手写出javascript节流和防抖函数
Oct 22 #Javascript
如何通过Proxy实现JSBridge模块化封装
Oct 22 #Javascript
微信小程序canvas动态时钟
Oct 22 #Javascript
vue-cli —— 如何局部修改Element样式
Oct 22 #Javascript
微信小程序入门之绘制时钟
Oct 22 #Javascript
You might like
实现php加速的eAccelerator dll支持文件打包下载
2007/09/30 PHP
优化php效率,提高php性能的一些方法
2011/03/24 PHP
基于MySQL分区性能的详细介绍
2013/05/02 PHP
php使用反射插入对象示例分享
2014/03/11 PHP
PHP常用技术文之文件操作和目录操作总结
2014/09/27 PHP
JavaScript之自定义类型
2012/05/04 Javascript
javascript中typeof的使用示例
2013/12/19 Javascript
JavaScript中连接操作Oracle数据库实例
2015/04/02 Javascript
javascript实现实时输出当前的时间
2015/04/27 Javascript
javascript鼠标滑动评分控件完整实例
2015/05/13 Javascript
javascript瀑布流式图片懒加载实例
2020/06/28 Javascript
Bootstrap滚动监听(Scrollspy)插件详解
2016/04/26 Javascript
JS框架之vue.js(深入三:组件1)
2016/09/29 Javascript
AngularJS 防止页面闪烁的方法
2017/03/09 Javascript
Vue列表如何实现滚动到指定位置样式改变效果
2020/05/09 Javascript
一篇文章带你使用Typescript封装一个Vue组件(简单易懂)
2020/06/05 Javascript
antd form表单数据回显操作
2020/11/02 Javascript
[01:42]DOTA2 – 虚无之灵
2019/08/25 DOTA
Python设计模式之观察者模式实例
2014/04/26 Python
解析Python中while true的使用
2015/10/13 Python
Python中easy_install 和 pip 的安装及使用
2017/06/05 Python
浅谈Python实现贪心算法与活动安排问题
2017/12/19 Python
python微信跳一跳系列之自动计算跳一跳距离
2018/02/26 Python
解决python3爬虫无法显示中文的问题
2018/04/12 Python
详解python多线程、锁、event事件机制的简单使用
2018/04/27 Python
Python Unittest根据不同测试环境跳过用例的方法
2018/12/16 Python
Python利用神经网络解决非线性回归问题实例详解
2019/07/19 Python
Python学习笔记之迭代器和生成器用法实例详解
2019/08/08 Python
美国大城市最热门旅游景点门票:CityPASS
2016/12/16 全球购物
英国文胸专家:AmpleBosom.com
2018/02/06 全球购物
护理自荐信范文
2013/10/05 职场文书
房地产推广策划方案
2014/05/19 职场文书
授权委托书范文
2014/07/31 职场文书
2015年春训学习心得体会范文
2015/03/09 职场文书
钱学森电影观后感
2015/06/04 职场文书
退休教师欢送会致辞
2015/07/31 职场文书