threeJS 踩坑

• 在官网学习的引入方法
  
  报错信息如下：

Failed to resolve module specifier "three". Relative references must start with either "/", "./", or "../".

查啦很多东西 自己才疏学浅：但是大概原因我理解就是，modle下引入sdn在线资源没问题；但是OrbitControls.js文件中有impot导入；而正常html不支持语法，所以我改成如下：

<script type="importmap">
    {
        "imports": {
            "three": "https://cdn.bootcdn.net/ajax/libs/three.js/r99/three.module.js"
        }
    }
</script>
<script type="module">
    import * as THREE from 'https://cdn.bootcdn.net/ajax/libs/three.js/r99/three.module.js';
    import { OrbitControls } from 'https://cdn.skypack.dev/three@v0.141.0/examples/jsm/controls/OrbitControls.js';

</script>
1
2
3
4
5
6
7
8
9
10
11
12

Uncaught SyntaxError: The requested module 'three' does not provide an export named 'TOUCH' (at OrbitControls.js:6:2)

原因是我threejs和imports中用的是两个版本，https://cdn.bootcdn.net上我没找到OrbitControls JS，现在我解决方法就是下载完整threeJs包到我的项目中，如下

问题是解决啦，但是我还在疑惑，希望大佬们有好的方案可告知；sdn引入方式