@ant-design/icons-react/es已安装仍报错找不到

Question

问题描述

使用creat-react-app创建的react项目，使用antd时发现样式没有引入成功，去官方文档找解决方法，使用了官方推荐的babel-plugin-import、react-app-rewired 和customize-cra，仍然失败。在 create-react-app 中使用-高级配置

问题出现的环境背景及自己尝试过哪些方法

（1）最开始报错

我的解决方式：
npm install @ant-design/icons -s
npm install @ant-design/icons-react -s

(2)此时在node_module中可以看到已经存在这两个文件夹

接下来 npm start
却还是上面的错误提示！

相关代码

// 请把代码文本粘贴到下方（请勿用图片代替代码）

config-overrides.js

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

module.exports = override(
  fixBabelImports('import', {
    libraryName: 'antd',
    libraryDirectory: 'es',
    style: 'css',
  }),
);

你期待的结果是什么？实际看到的错误信息又是什么？

期待结果是能够跑起来，但是：

/Users/myname/node_modules/@ant-design/icons-react/es/utils.js
Module not found: Can't resolve 'react' in '/Users/myname/node_modules/@ant-design/icons-react/es'

Answer 1

style改为true

module.exports = override(
  fixBabelImports('import', {
    libraryName: 'antd',
    libraryDirectory: 'es',
    style: true,
  }),
);

并且在webpack中添加less-loader,并且开启less-loader配置项javascriptEnabled: true
例：

          use: [{
            loader: 'less-loader', options: {
              javascriptEnabled: true,
            },
          }]

Answer 2

遇到了跟楼主一模一样的问题，也是This dependency was not found:

• react in ./node_modules/@ant-design/icons/es/utils.js,

解决方法：npm install --save react

安装完即可启动