create-react-app 升级CRA 5,减少模块无法工作

2fjabf4q 于 4个月前发布在 React

关注(0)|答案(2)|浏览(50)

描述bug

当我运行yarn start时，终端运行正常，没有报告错误。但是当我运行yarn build时，终端报告以下消息：
Attempted import error: './style.module.less' does not contain a default export (imported as 'styles').
我使用react-app-rewired和custom-cra重写webpack配置，我的配置如下：

config = addLessLoader({
    lessLoaderOptions: {
      lessOptions: {
        javascriptEnabled: true,
        cssModules: {
          getLocalIdent: getCSSModuleLocalIdent,
          localIdentName: '[name]_[local]__[hash:base64:5]',
        },
      },
    },
    cssLoaderOptions: {
      sourceMap: true,
      importLoaders: 1,
      modules: {
        getLocalIdent: getCSSModuleLocalIdent,
        localIdentName: '[name]_[local]__[hash:base64:5]',
      },
    },
  })(config);

你尝试恢复依赖了吗？

(在这里写下你的答案。)

你在用户指南中搜索了哪些术语？

我尝试搜索'less模块','cra5和less'等。

环境

"react-app-rewired": "^2.2.1",
    "react-dev-utils": "^11.0.3",
    "react-scripts": "5.0.1",

重现问题的步骤

(在这里写下你的步骤：)

预期行为

构建bundle无错误

实际行为

(写下发生了什么。请添加截图！)

可复现的示例

(粘贴一个示例项目的链接和精确的重现问题说明。)

create-react-app

来源：https://github.com/facebook/create-react-app/issues/12393

2条答案

按热度按时间

iqjalb3h1#

仍然想知道为什么react-scripts不支持Less。

赞(0）回复(0）举报 4个月前

nnvyjq4y2#

尝试一下：
// config-overrides.js

module.exports = function override(config, env) {
  config.module.rules[1].oneOf.splice(2, 0, {
    test: /\.less$/i,
    use: [
      { loader: "style-loader" },
      { loader: "css-loader" },
      {
        loader: "less-loader",
        options: {
          lessOptions: {
            javascriptEnabled: true,
          },
        },
      },
    ],
  })

  return config
}