问答

react 按需加载引用antd时报错

作者:admin 2021-08-21 我要评论

按照antd的文档,使用create-react-app新建好项目,引用 react\-app\-rewired customize\-cra babel-plugin-import ,根目录下的文件 config-overrides.js 也是按...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

按照antd的文档,使用create-react-app新建好项目,引用react\-app\-rewired customize\-cra babel-plugin-import,根目录下的文件 config-overrides.js也是按照文档配置,然后启动项目就会报错。搜索一些问题,都是将配置reject,修改了webpack,目前没找到问题原因,请教一下大神们。
屏幕快照 2020-05-07 09.26.21.png
屏幕快照 2020-05-07 09.30.10.png

###

自己找了好久,最后问题在stackoverflow上找到了解决问题,希望一下解决方案对有类似问题的小伙伴有帮助:stackoverflow问题地址连接

customize-cra的当前版本与create-react-app的最新版本不兼容,准确地说,与css-loader不兼容。尝试安装customize-cra@next以获取alpha版本。他们在那里解决了那个问题。

但是,在config-overrides.js中,也不能按照antd文档中的那样直接写

// ***错误的,也会提示报错***
addLessLoader({
    javascriptEnabled: true,
    modifyVars: { '@primary-color': '#F00' }
  })

只有一下属性是有效的:
object { lessOptions?, prependData? appendData? sourceMap? }

所以对addLessLoader参数需要修改:

// ***将配置放在lessOptions中***
addLessLoader({
    lessOptions: {
      javascriptEnabled: true,
      modifyVars: { '@primary-color': '#F00' }
    }
  })

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • 使用箭头函数return数据不能实现

    使用箭头函数return数据不能实现

  • 个人小程序号能接入小程序3D地图吗?

    个人小程序号能接入小程序3D地图吗?

  • vue 移动端项目中,使用了better-scrol

    vue 移动端项目中,使用了better-scrol

  • css如何做出区域平均划分为四列

    css如何做出区域平均划分为四列

腾讯云代理商
海外云服务器