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 相关文章推荐
Opacity.js
Jan 22 Javascript
jQuery 联动日历实现代码
May 31 Javascript
javascript原型模式用法实例详解
Jun 04 Javascript
基于jQuery和CSS3制作响应式水平时间轴附源码下载
Dec 20 Javascript
BootStrapTable服务器分页实例解析
Dec 20 Javascript
Angular中的interceptors拦截器
Jun 25 Javascript
JavaScript中使用参数个数实现重载功能
Sep 01 Javascript
JS实现的文件拖拽上传功能示例
May 21 Javascript
Vue中 key keep-alive的实现原理
Sep 18 Javascript
详解Vue iview IE浏览器不兼容报错(Iview Bable polyfill)
Jan 07 Javascript
关于微信小程序登录的那些事
Jan 08 Javascript
Vue登录主页动态背景短视频制作
Sep 21 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
网页游戏开发入门教程三(简单程序应用)
2009/11/02 PHP
php二分查找二种实现示例
2014/03/12 PHP
php实现的IMEI限制的短信验证码发送类
2015/05/05 PHP
Avengerls vs Newbee BO3 第一场2.18
2021/03/10 DOTA
懒就要懒到底——鼠标自动点击(含时间判断)
2007/02/20 Javascript
javascript 类方法定义还是有点区别
2009/04/15 Javascript
jQueryUI的Dialog的简单封装
2010/06/07 Javascript
js获取图片大小的函数代码
2011/09/20 Javascript
解读JavaScript中 For, While与递归的用法
2013/05/07 Javascript
javascript实现复制与粘贴操作实例
2014/10/16 Javascript
javascript背景时钟实现方法
2015/06/18 Javascript
javascript常用的方法整理
2015/08/20 Javascript
JavaScript正则表达式替换字符串中图片地址(img src)的方法
2017/01/13 Javascript
js实现倒计时效果(小于10补零)
2017/03/08 Javascript
你有必要知道的10个JavaScript难点
2017/07/25 Javascript
Vue 动态设置路由参数的案例分析
2018/04/24 Javascript
详解如何在webpack中做预渲染降低首屏空白时间
2018/08/22 Javascript
vue中filters 传入两个参数 / 使用两个filters的实现方法
2019/07/15 Javascript
HTML+JavaScript实现扫雷小游戏
2019/09/30 Javascript
vue-form表单验证是否为空值的实例详解
2019/10/29 Javascript
[01:09]DOTAPLUS——DOTA2的新时代
2018/04/04 DOTA
python使用ctypes模块调用windowsapi获取系统版本示例
2014/04/17 Python
Python抓取京东图书评论数据
2014/08/31 Python
Python最长公共子串算法实例
2015/03/07 Python
详解使用python的logging模块在stdout输出的两种方法
2017/05/17 Python
Python实现读写INI配置文件的方法示例
2018/06/09 Python
详解Python中的分支和循环结构
2020/02/11 Python
CSS3实现大小不一的粒子旋转加载动画
2016/04/21 HTML / CSS
GUESS西班牙官方网上商城:美国服饰品牌
2017/03/15 全球购物
美国综合购物商城:UnbeatableSale.com
2018/11/28 全球购物
工作人员思想汇报
2014/01/09 职场文书
中学生自我鉴定
2014/02/04 职场文书
银行自荐信范文
2015/03/25 职场文书
焦裕禄观后感
2015/06/03 职场文书
2016拓展训练心得体会范文
2016/01/12 职场文书
Nginx的gzip相关介绍
2022/05/11 Servers