HTML Webpack Plugin

[gregorskii]

I might be missing something. But this creates the modernizr file correctly but does not add it to my template...?

const ModernizrWebpackPlugin = require('modernizr-webpack-plugin');

...

plugins: [
    new ModernizrWebpackPlugin({
      htmlWebpackPlugin: true,
      filename: utils.assetsPath('js/modernizr.[chunkhash].js'),
      minify: {
        output: {
          comments: true,
          beautify: true
        }
      }
    }),

What am I doing wrong?

Thanks!

[hansthinhle]

I've faced the same issue:

       const htmlInjection = new HtmlWebpackPlugin({
        filename: 'index.html',
        hash: true,
        inject: 'body',
        template: './src/index.html'
    });

    config.plugins.push(
        new webpack.optimize.CommonsChunkPlugin('vendor', '[name].js'),
        htmlInjection,
        new ModernizrPlugin({
            'htmlWebpackPlugin': htmlInjection,
            'options': ['setClasses', 'mq', 'addTest', 'testAllProps'],
            'filename': 'modernizr.js',
            'noChunk': true,
            'minify': {
                output: {
                    comments: false,
                    beautify: false
                }
            },
            'feature-detects': [
                'touchevents',
                'input',
                'canvas',
                'css/resize'
            ]
        })
    );

I end up adding this to the head of my index.html:

<script src="<%= htmlWebpackPlugin.files.modernizr %>"></script>

[Hubro]

I'm facing this issue too, nothing I do seems to make this plugin inject the script into the HTML, and I've tried everything I can think of. I can't just add it myself either, since I use a hash in the file name for cache busting.

[neutraali]

@Hubro I use cache-busting for filenames too. In your HTML template, you can do stuff like:

<% for(var i in htmlWebpackPlugin.files) { %>
    <% if (i === 'modernizr') { %>
        <script type="text/javascript" src="<%= htmlWebpackPlugin.files[i] %>" defer></script>
    <% } %>
<% } %>

^ The check depends on your filename. It would obviously be better if this worked out of the box... :)

[daviddelusenet]

Also experiencing this issue.