同项目组的小伙伴想用自己的电脑访问我电脑上开发阶段的create-react-app创建的react项目。

试过了了各种内网穿透工具ngrok以及localtunnel等。

奈何打开效率实在太过于龟速。

于是不得不百度 react项目如何开启内网访问

结果找了说是要配置webpack。

好吧,配就配。。。

可是对于还没有eject的项目来说,webpack配置没暴露出来,没法配啊。

果断npm run eject。

eject后报了一大堆错。掰着指头数下来有5,6,7,8个~

直接npm start都运行不起来了。

幸好代码在eject之前git push了

于是又重新git clone

回到没npm run eject之前的版本。

今天意外的搜索了一个 localhost

结果不得了

在根目录下的serviceWorker.js文件里发现了一个小东西,就是下面这货



然后把 localhost改为自己的内网iP地址就大功告成了~

以上。

【React踩坑记六】create-react-app创建的react项目通过iP地址访问(实现局域网内访问)的更多相关文章

  1. 【React踩坑记一】React项目中禁用浏览器双击选中文字的功能

    常规项目,我们只需要给标签加一个onselectstart事件,return false就可以 例: <div onselectstart="return false;" & ...

  2. 【React踩坑记五】React项目中引入并使用react-ace代码编辑插件(自定义列表提示)

    最近有一个引入sql编辑器插件的需求,要求代码高亮显示,代码智能提示,以及支持自定义代码提示列表等功能.中途在自定义代码提示列表中由于没有相关demo,所以踩了一些坑,遂将其整理如下,以便日后查看. ...

  3. 【React踩坑记四】React项目中引入并使用js-xlsx上传插件(结合antdesign的上传组件)

    最近有一个前端上传并解析excel/csv表格数据的需求. 于是在github上找到一个14K star的前端解析插件 github传送门 官方也有,奈何实在太过于浅薄.于是做了以下整理,避免道友们少 ...

  4. 【React踩坑记三】React项目报错Can't perform a React state update on an unmounted component

    意思为:我们不能在组件销毁后设置state,防止出现内存泄漏的情况 分析出现问题的原因: 我这里在组件加载完成的钩子函数里调用了一个EventBus的异步方法,如果监听到异步方法,则会更新state中 ...

  5. 【React踩坑记二】react项目实现JS路由跳转

    这里使用的是4.31版本的react-router-dom "react-router-dom": "^4.3.1", 直接使用以下代码即可实现路由跳转 thi ...

  6. React踩坑记

    一: Support for the experimental syntax 'classProperties' isn't currently enabled ERROR in ./src/inde ...

  7. react 踩坑记

    yarn  node-sass 安装失败 yarn config set sass-binary-site http://npm.taobao.org/mirrors/node-sass yarn i ...

  8. 【React踩坑记三】React项目报错Can't perform a React state update on an unmounted component

    意思为:我们不能在组件销毁后设置state,防止出现内存泄漏的情况 分析出现问题的原因: 我这里在组件加载完成的钩子函数里调用了一个EventBus的异步方法,如果监听到异步方法,则会更新state中 ...

  9. Hook踩坑记:React Hook react-unity-webgl

    自公司前后分离上手React以来,一个坑一个坑的踩,Class的全生命周期云里雾里,还么屡明白,就抱上了Hook的大腿不松手,确实爽到飞起.修改到Hook的过程基本比较顺畅,直接少了三分之一的代码,组 ...

随机推荐

  1. C++中的map

    c++中的map类型变量不能为const类型 示例 struct INST{ string name; string type; string func; }; map<string, INST ...

  2. 路由与交换,cisco路由器配置,基础知识点(一)

    基础知识点 1.路由器与交换机端口初始化区别 路由器的所有接口默认都是关闭的 交换机的所有接口默认都是打开的 2.路由器 fastEthernet 端口 fastEthernet 0/0 第一个0代表 ...

  3. canvas压缩、裁切图片和格式转换的方法

    按照大小压缩图片,或者按照特定分辨率裁切图片,转为blob数据.自动处理ios中可能存在的照片偏差90°问题. 例如,获取300*300大小的头像,实现以下效果: 使用方式: <!-- 引入js ...

  4. 更快地访问stackoverflow

    使用火狐浏览器,安装扩展组件 Decentraleyes, 完成 原理:由于爆栈本身并没有被墙, 但使用了google的api,而google的api是被墙的. 该组件替换了国内不能访问的api,所以 ...

  5. alg-最长回文字符串

    class Solution { public: std::string longestPalindrome(const std::string& s) { if (s.empty()) { ...

  6. c++容器的底层数据结构

    序列式容器 vector ->底层数据结构为数组,支持快速随机访问 list ->底层数据结构为双向链表,支持快速增加和删除 deque ->底层数据结构为一个中央控制器和多个缓冲区 ...

  7. MySQL中information_schema 数据库 是干什么的

    MySQL中information_schema是什么 大家在安装或使用MYSQL时,会发现除了自己安装的数据库以外,还有一个information_schema数据库. information_sc ...

  8. 【three.js第二课】页面自适应

    1.在[three.js第一课]的基础上加入以下代码,改变窗口大小时,页面内容会自适应 //加入事件监听器,窗口自适应 window.addEventListener('resize', functi ...

  9. 数据结构之循环队列Demo

    循环队列 比较简单,循环队列主要是判断队满.队空.有效元素个数 画图说明: 假设:队的长度为5(0-4) 但是实际maxsize为6,需要一个预留空间(不存储元素)做计算 继续添加3个元素后: 出队一 ...

  10. D - Complete Tripartite

    三分图染色 链接:https://codeforces.com/contest/1228/problem/D 三分图染色步骤:First 首先找一个点1作为集合A中的点,再找到与1相连的一个点设为2, ...