I'm cleaning up a set of old web pages that load a lot of legacy JS one by one:
<html>
<head>
<script src="/js/module1.js" />
<script src="/js/module2.js" />
<script src="/js/module3.js" />
...
<script src="/js/module20.js" />
They are all rather small files, so a single call to a combined JS bundle would be faster, especially with cache on (ask once for a "not modified" instead of 20 times).
So I thought using rollupJS but I struggle to understand how to achieve my goal. I tried
rollup js/*.js --file bundle.js
to get the error:
[!] Error: Invalid value for option "output.file" - when building multiple chunks, the "output.dir" option must be used, not "output.file". To inline dynamic imports, set the "inlineDynamicImports" option.
Then I tried:
rollup js/*.js --dir temp
It resulted in a directory of individual processed files.
so next attempt:
rollup js/*.js --file bundle.js --inlineDynamicImports
Error: Invalid value for option "output.inlineDynamicImports" - multiple inputs are not supported when "output.inlineDynamicImports" is true
What do I miss - or do I need a different tool?
Goal: take all the JS in the directory and combine and minify it into on JS file