- Rollup Plugin Name: @rollup/plugin-html
- Rollup Plugin Version: 0.1.0
Feature Use Case
We ship rollup-plugin-index-html which, for multiple rollup builds, is able to output a single index.html file containing both build outputs. One version with modern js syntax and esm, and one version with es5 and systemjs for older browsers.
It's kind of a hacky solution, relying on an array of rollup configs. Now that we can have plugins per output I'm looking to update our solution to utilize this instead. For the html part I'd like to to use @rollup/plugin-html.
One problem I'm running into right now is that it's not possible to collect multiple bundles into one index.html.
Feature Proposal
Add the ability to collect multiple bundles into one index.html file. For example:
import html from '@rollup/plugin-html';
export default {
input: 'src/app.js',
output: [
{
format: 'esm',
dir: 'output',
},
{
format: 'system',
dir: 'output/legacy',
},
],
plugins: [
html({
template({ attributes, bundles, files, publicPath, title }) {
return `
<html>
<body>
<script type="module" src="${bundles[0]['app.js'].fileName}"></script>
<script nomodule src="s.js"></script>
<script nomodule src="${bundles[1]['app.js'].fileName}"></script>
</body>
</html>
`;
}
})
]
}
Right now, the generateBundle hook is used to which is of course called for each separate bundle.
A possible solution could be to use another hook which has the information of all the generated bundles. I couldn't find a suitable hook for this unfortunately.
Another solution could be to inspect the amount of generated bundles, and only output the index.html (and call the template function) when all the bundles have been collected.
Feature Use Case
We ship rollup-plugin-index-html which, for multiple rollup builds, is able to output a single
index.htmlfile containing both build outputs. One version with modern js syntax and esm, and one version with es5 and systemjs for older browsers.It's kind of a hacky solution, relying on an array of rollup configs. Now that we can have plugins per output I'm looking to update our solution to utilize this instead. For the html part I'd like to to use
@rollup/plugin-html.One problem I'm running into right now is that it's not possible to collect multiple bundles into one index.html.
Feature Proposal
Add the ability to collect multiple bundles into one
index.htmlfile. For example:Right now, the
generateBundlehook is used to which is of course called for each separate bundle.A possible solution could be to use another hook which has the information of all the generated bundles. I couldn't find a suitable hook for this unfortunately.
Another solution could be to inspect the amount of generated bundles, and only output the index.html (and call the template function) when all the bundles have been collected.