How to handle caching of JavaScript files imported as ES6 module : <h2>Old situation</h2>

<p>Previously, I used the following method to force the browser to reload my JavaScript file if there was a new version available.</p>

<pre><code>&lt;script src="common.js?version=1337"&gt;&lt;/script&gt;
&lt;script src="app.js?version=1337"&gt;&lt;/script&gt;
</code></pre>

<p>My HTML is automatically generated (e.g. with PHP), so this is easy to automate.</p>

<h2>New situation</h2>

<p>Now I want to use ES6 modules and import my common code.
My HTML becomes:</p>

<pre><code>&lt;script src="app.js?version=1337" type="module"&gt;&lt;/script&gt;
</code></pre>

<p>And <code>app.js</code> contains the import:</p>

<pre><code>import {foo, bar} from './common.js';
</code></pre>

<h2>Problem</h2>

<p>Now my question: how do I influence the caching of <code>common.js</code> in the new scenario?</p>

<p>I don't want to manually edit <code>app.js</code> every time I edit <code>common.js</code>. I also don't want to dynamically generate/pre-process any of my JavaScript files, if possible.</p>
