React之antd按需加载

虽然antd官网有提供按需加载的方法:

React之antd按需加载

但这种方法需要执行eject命令,而eject是不可逆的,会更改package文件,并且将所有的依赖都暴露在外面。我将自己的项目eject后,找不到package.json无法启动。

找到了别人不通过eject命令实现按需加载的方法:

1.下载依赖模块

npm install --save-dev babel-plugin-import react-app-rewired

2.新建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;

}

3.修改package.json

"scripts": {
  "start": "react-app-rewired start",
  "build": "react-app-rewired build",
  "test": "react-app-rewired test --env=jsdom",
  "eject": "react-scripts eject"
}