标签：sig 难度 踩坑 exports import wired 整理 eve 记录
这两天在用 ant design mobile 的时候碰到个问题：组件引入失败。
一直解决不掉，查了半天不知道是我的理解问题还是怎么，就是找不到正确方法。（官网方法居然不行，增加学习难度啊！啊喂！~）
最后让我找到了这么一句：“原因： react-scripts 升级到 2.1.2 以后破坏了 react-app-rewired;然后 react-app-rewired 升级到 2.x 以后直接干掉了所有 helpers。”
然后才注意到了这句话：
解决方法：把react-app-rewired 进行降级后可以了，即$ yarn add react-app-rewired@2.0.2-next.0
在此记录下警示文。
具体步骤回顾（dos命令整理到了一块）：
$ npm install -g create-react-app $ create-react-app my-app $ cd my-app $ npm install antd-mobile --save $ npm install babel-plugin-import --save-dev $ npm install react-app-rewired@2.0.2-next.0//直接安装指定版本 $ npm install react-app-rewired --save-dev//如果你已经安装过了 $ npm add react-app-rewired@2.0.2-next.0//可以进行降级处理
然后在项目入口页面加入以下代码（就是id=root 的那个页面一般在public下的index.html里）
<script src="https://as.alipayobjects.com/g/component/fastclick/1.0.6/fastclick.js"></script> <script> if (‘addEventListener‘ in document) { document.addEventListener(‘DOMContentLoaded‘, function() { FastClick.attach(document.body); }, false); } if(!window.Promise) { document.writeln(‘<script src="https://as.alipayobjects.com/g/component/es6-promise /3.2.2/es6-promise.min.js"‘+‘>‘+‘<‘+‘/‘+‘script>‘); } </script>
package.json修改
/* package.json */
"scripts": {
- "start": "react-scripts start",
+ "start": "react-app-rewired start",
- "build": "react-scripts build",
+ "build": "react-app-rewired build",
- "test": "react-scripts test --env=jsdom",
+ "test": "react-app-rewired test --env=jsdom",
}
最后在根目录底下创建一个config-overrides.js的文件写上
const { injectBabelPlugin } = require(‘react-app-rewired‘);
module.exports = function override(config, env) {
config = injectBabelPlugin([‘import‘, { libraryName: ‘antd-mobile‘, style: ‘css‘ }], config);
return config;
};
然后因为改动了package.json文件我们需要重新npm i 一下，再重启就可以了。
最后，写一下让我幡然醒悟的博文：https://www.cnblogs.com/NatChen/p/10437151.html （不知道算不算原创，反正来源是这里啦）
好了，今天的内容就到了这里。感谢观看。
标签：sig 难度 踩坑 exports import wired 整理 eve 记录
原文地址：https://www.cnblogs.com/langui233/p/13304521.html
