Webpack:ExtractTextPlugin:当有多个CSS入口点时不生成单独的空JS文件？

Question

我有几个 CSS 入口点:

entry: {
  ...
  styles: [
    ...
  ],
  fonts: [
    ...
  ]
},

我使用 ExtractTextPlugin 单独捆绑 CSS:

  new ExtractTextPlugin({
    filename: `[name].bundle.css`
  }),

就像输出一样，我有2个CSS文件:styles.css和fonts.css，这是正确的，但也是空的styles.js和fonts.js。有没有办法不生成空的JS文件？

Answer 1

我整理了一个webpack plugin根据最终输出大小删除额外的文件，因为我遇到了同样的问题 - 考虑到这些文件往往非常小，这似乎只是检查它们有多大并删除小的无用文件的情况。

使用npm或yarn安装

npm install webpack-extraneous-file-cleanup-plugin --save-dev
yarn add webpack-extraneous-file-cleanup-plugin --dev

在您的 webpack.config.js 文件中:

const ExtraneousFileCleanupPlugin = require('webpack-extraneous-file-cleanup-plugin');

module.exports = {
  ...
  plugins: [
    new ExtraneousFileCleanupPlugin({
      extensions: ['.js']
    })
  ]
}

您可以在Webpack Extraneous File Cleanup Plugin Github Page上查看完整的选项列表。