The following code will always log the same message even if the module has changed on the server, regardless of Cache-Control headers sent:
import('http://example.com/script.mjs').then(m => console.log(m.default))
unless the whole page is reloaded. Is there a programmatic way to bust the dynamic import cache, similar to delete require.cache[...] in NodeJS?
There is no direct method to clear the cache of a dynamic import in JavaScript in the browser. The cache behavior for dynamic imports depends on the browser implementation, and there is no standard way to clear the cache for a specific import statement.
One possible workaround is to append a unique query parameter to the URL of the imported module each time it is loaded. This will make the browser treat it as a different resource, bypassing the cache:
let url = 'http://example.com/script.mjs?' + Date.now(); import(url).then(m => console.log(m.default));
This approach will work as long as the server is configured to handle query parameters. You can also use other techniques, such as adding a hash of the file contents to the URL, to ensure that the browser is loading the latest version of the module.