Webpack4: <%= htmlWebpackPlugin.options.title %> not picking up the value

Question

Based on this tuorial: using html-webpack-plugin to generate index.html If you add a title option to html-webpack-plugin options like this:

new HtmlWebPackPlugin({
  template: './src/index.html',
  filename: './index.html',
  title: 'My App',
}),

And add the following snippet to your HTML template

<title><%= htmlWebpackPlugin.options.title %></title> 

It should pick up the title value from the plugin settings and show it inside the title tag.

But it seems that <%= htmlWebpackPlugin.options.title %> doesn't pick up the value! Could it be, that this feature is deprecated in Webpack 4?

Answer 1

I removed html-loader from webpack.config.js. And then, it works like a charm Regards

Answer 2

@user1941537

install the following dependencies:

npm install -D --safe-dev ejs-loader extract-loader

And add the rule for .html files as follows,

rules:[{
        test: /\.html$/,
        use:  ['ejs-loader', 'extract-loader', 'html-loader'] 
}]