我用three.js制作水，得到了这个错误：
Uncaught TypeError: Error resolving module specifier “three”. Relative module specifiers must start with “./”, “../” or “/”.
我用来创建水的HTML代码是：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>My first three.js app</title>
<style>
body { margin: 0; }
</style>
<script type="importmap">
{
"imports": {
"three": "./build/three.module.js",
"three.js-master/examples/jsm/controls/OrbitControls":"./jsm/controls/OrbitControls.js",
"three.js-master/examples/jsm/libs/stats.module":"./jsm/libs/stats.module.js",
}
}
</script>
</head>
<body>
<script type="module" src="https://cdn.jsdelivr.net/npm/three@0.143/build/three.min.js"></script>
<script type="module" src="https://cdn.jsdelivr.net/npm/three@0.143/examples/js/controls/OrbitControls.js"></script>
</script>
<script type="module">
import { Water } from 'http://localhost/Lines/jsm/objects/Water.js';
import * as THREE from 'http://localhost/Lines/build/three.module.js';
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
camera.position.set( 0, 0, 50 );
camera.lookAt( 0, 0, 0 );
const renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );
const WaterGeometry = new THREE.PlaneGeometry( 45, 45 );
const texture = new THREE.TextureLoader().load( 'https://i.imgur.com/mK9cHLq.jpeg' );
const material = new THREE.MeshBasicMaterial( { map: texture, side: THREE.DoubleSide } );
const controls = new THREE.OrbitControls( camera, renderer.domElement );
let water = new Water
(
WaterGeometry,
{
textureWidth: 512,
textureHeight: 512,
waterNormals: new THREE.TextureLoader().load
( 'textures/waternormals.jpg', function ( texture )
{
texture.wrapS = texture.wrapT = THREE.RepeatWrapping;
}
),
sunDirection: new THREE.Vector3(),
sunColor: 0xffffff,
waterColor: 0x001e0f,
distortionScale: 3.7,
fog: scene.fog !== undefined
}
);
controls.update();
scene.add( water );
function animate()
{
requestAnimationFrame( animate );
water.rotation.x += 0.00;
water.rotation.y += 0.00;
water.rotation.z += 0.01;
renderer.render( scene, camera );
};
animate();
</script>
</body>
</html>
很确定在我的文件夹中导入的javascript代码Water.js没有问题，我的HTML代码就是问题所在。
为什么我的代码会出现这种错误。请开导我。
我也遇到过同样的问题，它与HTML无关。对我来说，当我在网络服务器上上传脚本时，出现了这个问题。我只需要更改导入路径(在需要的地方添加../../(。我希望这对你有帮助。
当我用Firefox运行html文件时，出现了这个错误。当我使用Chrome时，它运行得很好。问题似乎是Firefox还不支持importmap，这是他们方面已知的错误。