Cssnano不会删除重复项

Question

我有一个React Web应用程序，其中使用CSS模块。我正在使用Webpack构建应用程序。

来自webpack.config.js的相关部分：

   public ConfigureAgGrid(gridOptions: GridOptions): GridOptions {
         rowSelection: 'multiple',
         gridOptions.columnDefs = columnDefs;
         gridOptions.rowData = data;
         onSelectionChanged: this.onSelectionChanged,
        gridOptions.api.sizeColumnsToFit();

        return gridOptions;
    }

缩小似乎有效。我可以在CSS中找到一些重复的CSS规则，如下所示

我想知道这是我的配置还是使用的工具（PostCss和CssNano）有问题

谢谢。

Answer 1

发生这种情况是因为您的CSS缩小器（css​​nano）为postcss-loader。加载程序将应用于每个分开的文件，因为cssnano看不到其他文件，因此无法删除文件中的重复项。

使用mini-css-extract-plugin。该插件也使用cssnano。但是在将每个文件连接到一个大包之后，它将调用cssnano。结果，cssnano可以一起看到所有CSS，并且能够删除整个捆绑包中的重复项。