为什么我的Webpack-cleanup-plugin删除我的排除文件?

时间:2019-06-25 21:13:21

标签: webpack webpack-plugin

背景:一个简单的页面react app + redux + express(以便上传到heroku)。
我已经在公用文件夹中有了index.html和images文件夹。我想运行webpack生成在index.html中使用的styles.css和bundle.js。我想每次运行build时都使用webpack-clean-up-plugin删除以前的多余文件,但是我不希望那会影响index.html和images文件夹之类的内容。
根据文档: *选项 如果要在输出路径中保留一些文件,例如从其他插件生成的stats.json文件,请使用exclude Array选项。它接受minimatch中的通配符。

//请勿删除stats.jsonimportant.jsonfolder中的所有内容

new WebpackCleanupPlugin({
  exclude: ["stats.json", "important.js", "folder/**/*"],
})

目标:运行webpack.prod.js,以便最终公用文件夹具有

  • index.html
  • bundle.js
  • bundle.js.map
  • styles.css
  • style.css.map
  • 图像(文件夹)

Webpack.config.prod.js

const { CleanWebpackPlugin } = require('clean-webpack-plugin')  
output: {
        path: path.join(__dirname, 'public'),
        filename: 'bundle.js'
    }, 
    plugins: [
        new MiniCssExtractPlugin({ 
            filename: "styles.css", 
            chunkFilename: "[id].css"}),
         new CleanWebpackPlugin({
         exclude: ["index.html", "images/*"],
        })
      ],  

当前结果:
每次我npm运行

"build:prod": "webpack --config webpack.config.prod.js --mode production",

我将删除index.html和images文件夹。那我在哪里写错了?

5 个答案:

答案 0 :(得分:3)

代替使用exlude
使用此选项

cleanOnceBeforeBuildPatterns: ["**/*", "!stats.json","!important.js", "!folder/**/*"]

这对我有用:)。 示例:

new CleanWebpackPlugin({
    root: process.cwd(),
    verbose: true,
    dry: false,
    cleanOnceBeforeBuildPatterns: ["**/*", "!stats.json","!important.js", "!folder/**/*"],
})

答案 1 :(得分:1)

这可能是路径问题。您可以使用'__dirname'来解决它

答案 2 :(得分:1)

您可以使用remove-files-webpack-plugin

配置:

plugins: [
  new RemovePlugin({
    before: {
      // expects what your output folder is `dist`.
      test: [
        {
          folder: './dist',
          method: () => true
        }
      ],
      exclude: [
        './dist/index.html',
        './dist/images'
      ]
    }
  })
]

注意:我是此插件的创建者。

答案 3 :(得分:0)

无论如何,阅读更多内容后,我决定不再使用此插件。因为人们一直在重复与我相似的问题。作者在2018年3月22日表示,他没有时间去维护我们应该关闭此插件的时间。 view this on github

答案 4 :(得分:0)

显然,未明确引用的文件被视为过时的文件并被删除。这对我来说可以跳过清理由CopyWebpackPlugin

复制的文件
new CleanWebpackPlugin({
   cleanStaleWebpackAssets: false,
}),