antd 按需加载less报错

Question

!

2
上面报错信息，配置如下：

{
  "presets": ["next/babel"],
  "plugins": [
    "@babel/plugin-proposal-object-rest-spread",
    ["styled-components", { "ssr": true, "displayName": false }],
    ["import", { "libraryName": "antd", "libraryDirectory": "es", "style": true }] 
  ]
}

module.exports = withPlugins([[less, {
  lessLoaderOptions : {
    javascriptEnabled : true
  }
}], css, bundleAnalyzer], {
  webpack(config) {

    config.resolve.alias = {
      ...(config.resolve.alias || {}),
      components: path.resolve('components'),
    }

   

    config.module.rules.push({
      test: /\.less$/,
      // exclude: [/node_modules/],
      use: [
        {
          loader: 'less-loader',
          options: {
            javascriptEnabled: true,
            modifyVars: themeVariables,
          },
        },
      ],
    })

    return config
  },

下面代码可以解决！！！

module.exports = withPlugins([[less, {
  lessLoaderOptions : {
    javascriptEnabled : true
  }
}], css, bundleAnalyzer], {
  webpack(config) {

    config.resolve.alias = {
      ...(config.resolve.alias || {}),
      components: path.resolve('components'),
    }
   

  if(config.externals){
      const includes = [/antd/];
      config.externals = config.externals.map(external => {
        if (typeof external !== 'function') return external;
        return (ctx, req, cb) => {
          return includes.find(include =>
            req.startsWith('.')
              ? include.test(path.resolve(ctx, req))
              : include.test(req)
          )
            ? cb()
            : external(ctx, req, cb);
        };
      });
    }

    return config
  },

Answer 1

把 exclude: [/node_modules/], 去掉试试。