Concatenated and mini CSS files with Webpack without requiring them

Question

I have an old part of the application that contains some CSS files that are combined and reduced using a gulp script.

And I have a new application that comes with Webpack.

Is it possible to compile old CSS with Webpack without any additional calls? Just get all the CSS from old_css / ** / *. Css, concat, minify and write to assets / old.css?

Answer 1

You can achieve this by “requiring” CSS files through a separate entry . You will get something like this:

{ entry: { styles: glob('old_css/**/*.css'), // array of css files ... }, output: { filename: '[name].[chunkhash].js', ... }, module: { loaders: [ { test: /\.css$/, loader: ExtractTextPlugin.extract("style-loader", "css-loader") }, ... ] }, plugins: [ new ExtractTextPlugin('[name].[chunkhash].css'), ... ], ... } 

In addition to the CSS file, you will get a JavaScript file named for your style. However, you can ignore this.