react中antd的引用完整流程介绍

BuckKevin 发布于3月前
0 条问题

今天的第二篇小记来了。
antd官网中有关于react中导入antd的介绍

 https://ant.design/docs/react/use-with-create-react-app-cn

但是却没有得到我们想要的效果。
错误如下:The "injectBabelPlugin" helper has been deprecated as of v2.0
解决办法如下:https://github.com/ant-design...
但是我还是把流程写下吧,需要自取哟!
第一步:npm i antd --save
第二步:npm i react-app-rewired -D 后更改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",
+   "test": "react-app-rewired test",
}

第三步:安装按需加载插件 npm install babel-plugin-import
第四步: npm install customize-cra --save
第四步:在项目根目录创建一个 config-overrides.js 用于修改默认配置。

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

以上流程介绍完毕,antd官网关于这方面的介绍需要更新啦。。。
如果需要less等支持,还是需要参考官网的,请大家积极查阅相关资料啦!本文就不做叙述啦,嘻嘻嘻!

查看原文: react中antd的引用完整流程介绍

  • orangerabbit
  • purplerabbit
  • whitegorilla
  • bluepeacock
  • browntiger
  • bigtiger
需要 登录 后回复方可回复, 如果你还没有账号你可以 注册 一个帐号。