[Proposal] Hash (local) script imports

Currently to import a script you need it to have a URL, such as an HTTP url, data or blob. But there is no way to import modules that are local to the document inside a script tag. what if you could use a hash URI to import those? Like this:

<script type="module" id="someLocalScript">
export function fun() { return "Hello" }
</script>

<script type="module">
   import {fun} from "#someLocalScript"
   console.log(fun())
</script>

I’ve encountered this trying to build some browser-based dev-tools, and had to resort to using blobs and eval to achieve something similar.

So the script if evaluated and run like a normal script, but can be accessed using import?

Can a script be overridden by another script with identical id?

What if it’s replaced with another script and then imported again?

I’m imagining it would work the same as calling getElementById() at the time of importing.

That means that such a script would not resolve if the script is removed from the DOM. I imagined it as registering a module that is available once loaded.

Then as long as the script is evaluated and attached to the DOM, any imports to it returns the same reference, but if removed and re-appended, then it is a new script overriding the module for any future import?

Good questions. In general yes, it sounds about right. It should behave similarly to SVG references in shapes.