Html-webpack-plugin: using image assets

Created on 24 Jul 2015 · 8Comments · Source: jantimon/html-webpack-plugin

How can I include assets that aren't JS or CSS?

It obviously requires a custom template, but somehow I need to specify that I will need these files so they get added to the list of assets. I think it needs to work the same way favicon does.

        <link rel="apple-touch-icon" href="assets/img/touch-icon-iphone.png">
        <link rel="apple-touch-icon" sizes="76x76" href="assets/img/touch-icon-ipad.png">
        <link rel="apple-touch-icon" sizes="120x120" href="assets/img/touch-icon-iphone-retina.png">
        <link rel="apple-touch-icon" sizes="152x152" href="assets/img/touch-icon-ipad-retina.png">

Source

AsaAyers

Most helpful comment

Thanks. I'm trying out your branch. It doesn't seem to be picking up my files automatically, but I can do this and it works. ¯_(ツ)_/¯

    <link rel="apple-touch-icon" href="<%= require('./assets/img/touch-icon-iphone.png') %>">

AsaAyers on 24 Jul 2015

👍9 ❤1

All 8 comments

Take a look at the 2.0 branch: https://github.com/ampedandwired/html-webpack-plugin/blob/feature/loaders/examples/html-loader/template.html

jantimon on 24 Jul 2015

How close is this 2.0 branch to being ready? I have a production browserify project that I'm almost done converting to webpack. This is the last piece of the puzzle.

AsaAyers on 24 Jul 2015

Well - I guess 2.0 is more or less feature complete but might need some further improvements.

If you don't want to use the 2.0 beta of this plugin might help you: https://www.npmjs.com/package/transfer-webpack-plugin

jantimon on 24 Jul 2015

Thanks. I'm trying out your branch. It doesn't seem to be picking up my files automatically, but I can do this and it works. ¯_(ツ)_/¯

    <link rel="apple-touch-icon" href="<%= require('./assets/img/touch-icon-iphone.png') %>">

AsaAyers on 24 Jul 2015

👍9 ❤1

If it doesn't picking up links it might be a bug of the html-loader

jantimon on 24 Jul 2015

I'm after the exact same thing. I'd like to be able to inject images (and possibly even css files) into a template, and then have those assets get built as part of the normal webpack build. I'm not specifically seeing a "2.0" branch. Do you mean the "feature/loaders" branch?