What is <script type="importmap"> and why do I suddenly need it for my code to work?
<script type="importmap">
{
"imports": {
"three": "https://example.com/3dstuff/three.module.js"
}
}
</script>
Before, I would just write this and Three.js would work, but now this part doesn't work without the importmap:
<script type="module"> import * as THREE from "https://example.com/3dstuff/three.module.js";
The importmap in your code is essentially setting up a shortcut from the string "three" to the actual .js file URL. What you should be writing in your <script type="module"> is import * as three from "three"; and it will automatically resolve to the URL due to the importmap you defined before.
From https://github.com/WICG/import-maps:
By supplying the browser with the following import map
<script type="importmap">
{
"imports": {
"moment": "/node_modules/moment/src/moment.js",
"lodash": "/node_modules/lodash-es/lodash.js"
}
}
</script>
the above would act as if you had written
import moment from "/node_modules/moment/src/moment.js";
import { partition } from "/node_modules/lodash-es/lodash.js";