I'm trying to minify my html file with Webpack with HtmlWebpackPlugin
plugin. I manage to make an index.html
file into my dist
loader, but I got some trouble to minify it.
dist/
node_modules/
src/
ejs/
js/
css/
server.js
webpack.config.js
package.js
webpack.config.js :
var HtmlWebpackPlugin = require('html-webpack-plugin');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
module.exports = {
entry: './src/js/index.js',
devtool: 'source-map',
output: {
publicPath: '/dist/'
},
module: {
rules: [
{
test: /\.ejs$/,
use: ['ejs-loader']
},
{
test: /\.css$/,
use: ExtractTextPlugin.extract({
use: [{
loader: 'css-loader',
options: {
url: false,
minimize: true,
sourceMap: true
}
}]
})
}
]
},
plugins: [
new HtmlWebpackPlugin({
template: './src/ejs/index.ejs',
minify: true
}),
new ExtractTextPlugin({
filename: 'main_style.css'
})
]
}
Not sure what is the issue you are facing exactly, but you can try passing explicit parameters in your minify property instead of a boolean. For example, to remove whitespace try the following:
Try:
new HtmlWebpackPlugin({
template: './src/ejs/index.ejs',
filename: 'index.ejs',
minify: {
collapseWhitespace: true
}
})
This works for me.
For the full list of options check the documentation.