无法配置带有电子反应样板的小型装载机

Question

我使用Ant设计和电子反应模板，需要加载更少的文件作为全局样式来自定义其主题颜色，如提到的这里。我在webpack.config.renderer.dev.babel.js和webpack.config.renderer.prod.babel.js中配置了较少的加载程序，如

{
    test: /\.less$/,
    use: [{
      loader: 'style-loader',
    }, {
      loader: 'css-loader',
    }, {
      loader: 'less-loader',
      options: {
        lessOptions: {
          modifyVars: {
            'primary-color': '#e6315a',
            'link-color': '#e6315a',
            'border-radius-base': '2px',
          },
          javascriptEnabled: true,
        },
      },
    }],
  },

这是我的减少文件

@import '~ag-grid-community/dist/styles/ag-grid.css';
@import '~ag-grid-community/dist/styles/ag-theme-alpine.css';
@import '~antd/dist/antd.less';

当我尝试使用yarn dev，在开发中运行时，它在自定义主题颜色上运行良好，但是当我尝试使用yarn start，在production中运行时，它显示了带有此错误的空白屏幕。

​

Answer 1

您只需在loader: 'style-loader',中用loader: MiniCssExtractPlugin.loader替换webpack.config.renderer.prod.babel.js

global.less 全球减

其他.less文件减少文件而不是全局文件

希望这能帮到你