Html-webpack-plugin: Adding custom attributes to injected scripts tags

[ellipticaldoor]

Hi,

Now webpack is injecting this in my index.html after npm run build

<script type="text/javascript" src="./static/js/manifest.0298f1f656f4d6c242e0.js"></script>

I want to add a class and also change the attribute src to data-src, how I can do that?

[jantimon]

Set inject:false and use the template options

[ellipticaldoor]

Please, can you give me a hint in how to do it?

I'm searching and searching but I can't find an example.

If I put inject:false the css and scripts doesn't appear in the final index.html

What should I put in my index.html?

[jantimon]

See the readme:
https://github.com/ampedandwired/html-webpack-plugin#writing-your-own-templates

It also links to:
https://github.com/jaketrent/html-webpack-template/blob/master/index.ejs

[ellipticaldoor]

Thanks! It worked. As you said I leaved inject: false, renamed my template from index.html to index.ejs

and then where I want my scripts to load with custom attributes I did this

<% for (key in htmlWebpackPlugin.files.js) { %>
    <script type="text/javascript" data-src="<%= htmlWebpackPlugin.files.js[key] %>"></script>
<% } %>

[jantimon]

Cool 👍

[lock[bot]]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.