Ant-design-mobile: antd-mobile按需加载 The "injectBabelPlugin" helper has been deprecated as of v2.0

[Calinas]

• [ ] I have searched the issues of this repository and believe that this is not a duplicate.

Reproduction link

https://mobile.ant.design/docs/react/introduce-cn

Steps to reproduce

按照文档安装babel-plugin-import 之后，npm start之后无法启动服务。报错：The "injectBabelPlugin" helper has been deprecated as of v2.0. You can use customize-cra plugins in replacement - https://github.com/arackaf/customize-cra#available-plugins。 injectBabelPlugin已经不支持了，要换成customize-cra。

What is expected?

希望文档更新一下。config-overrides.js配置如下：

const {
  override,
  fixBabelImports
} = require("customize-cra");

module.exports = override(
  fixBabelImports("babel-plugin-import", {
    libraryName: "antd-mobile",
    style: "css"
  })
);

What is actually happening?

The "injectBabelPlugin" helper has been deprecated as of v2.0. You can use customize-cra plugins in replacement

| Environment | Info |
|---|---|
| antd | 2.2.6 |
| React | 16.8.3 |
| System | 不涉及 |
| Browser | 不涉及 |

---

实际版本2.2.9

[arfaWong]

yarn add less
yarn add --dev react-app-rewired customize-cra less-loader 

// config-overrides.js

const {
  addLessLoader,
  fixBabelImports,
  override
} = require("customize-cra");

module.exports = {
  webpack: override(
    addLessLoader({
      javascriptEnabled: true
    }),
    fixBabelImports("babel-plugin-import", {
      libraryName: "antd-mobile",
      style: true
    })
  )
};

[jsxiao]

• [ ] I have searched the issues of this repository and believe that this is not a duplicate.

Reproduction link

https://mobile.ant.design/docs/react/introduce-cn

Steps to reproduce

按照文档安装babel-plugin-import 之后，npm start之后无法启动服务。报错：The "injectBabelPlugin" helper has been deprecated as of v2.0. You can use customize-cra plugins in replacement - https://github.com/arackaf/customize-cra#available-plugins。 injectBabelPlugin已经不支持了，要换成customize-cra。

What is expected?

希望文档更新一下。config-overrides.js配置如下：

const {
  override,
  fixBabelImports
} = require("customize-cra");

module.exports = override(
  fixBabelImports("babel-plugin-import", {
    libraryName: "antd-mobile",
    style: "css"
  })
);

What is actually happening?

The "injectBabelPlugin" helper has been deprecated as of v2.0. You can use customize-cra plugins in replacement

Environment Info
antd 2.2.6
React 16.8.3
System 不涉及
Browser 不涉及
实际版本2.2.9

非常感谢提供的解决办法！

[meijiangyan]

const {
override,
fixBabelImports
} = require("customize-cra");

module.exports = override(
fixBabelImports("babel-plugin-import", {
libraryName: "antd-mobile",
style: "css"
})
);

thanks

[meiminjun]

style-loader 升级了，导致dev 环境antd-mobile 按需引入的样式获取不到，降级即可，bye bye!