CODEWITHSUNDEEP
hashwebpackdelete-filecache-control
Philll_t
Philll_t

Reputation: 4437

Hashing in web pack works, but old files linger on every build

I want to be able to delete old files (specifically those not found in the latest webpack-assets.json). Since new files with a hash are created, they don't replace the old ones, but at the same time I can't just clear the entire directory as not all the files will be replaced.

I was wondering, if there is a way to get rid of files that are not in the webpack-assets.json after it is updated. Here's my config:

var path = require('path');
var webpack = require('webpack');
var ChunksPlugin = require('webpack-split-chunks');
var AssetsPlugin = require('assets-webpack-plugin');
var glob = require('glob');
var assetsPluginInstance = new AssetsPlugin();
// TODO add prefixer for  >= IE9

var input_path  = __dirname + "/apps/*/index.js";
var output_path = __dirname +'/dist';

// Prepare project paths for multiple projects into entry_files
var projects = glob.sync(input_path);
var entry_files = {};
projects.map(function(project_dir, k){
          var split_name = project_dir.split("/");
          entry_files[split_name[split_name.length - 2]] = project_dir;
    });

module.exports = {
    devtool: 'cheap-module-eval-source-map',
    entry: entry_files,
    module: {
        loaders: [
            {
                test: /\.js$/,
                loaders: ['babel'],
                exclude: /node_modules/
            },
            {
                test: /\.scss/,
                loader: 'style-loader!css-loader?sourceMap!sass-loader?sourceMap'
            }
        ]
    },
    output: {
        path: output_path,
         filename:  '[name].min.[hash].js'
        // filename:  '[name].min.js'
    },
    watch: true,
    plugins: [
        assetsPluginInstance,
        new webpack.optimize.OccurrenceOrderPlugin(),
        new ChunksPlugin({
           to: 'common.[hash]',
           // to: 'common',
           test: [/node_modules/, /shared/] // or an array of regex
       })
    ]
};

Upvotes: 1

Views: 1284

Answers (1)

redconservatory
redconservatory

Reputation: 21924

You can use the CleanWebpackPlugin:

npm install clean-webpack-plugin --save-dev

And then add it to your plugins settings:

   var CleanWebpackPlugin = require('clean-webpack-plugin');

   module.exports = {
      plugins: [
        new CleanWebpackPlugin(['dist', 'build'], {
          root: '/full/project/path',
          verbose: true, 
          dry: false,
          exclude: ['shared.js']
        })
      ]
    }

Upvotes: 3

Related Questions