three.js - 空白白屏和 ReferenceError：未定义三个
问题描述
几年来我一直在练习 3d 建模，但没有编码。由于将现成的 3d 模型加载到 3js 的需求正在增加，我决定开始编码。在对我的第一个代码进行了 2 天的反复试验后，我将与您分享似乎无法正常工作的代码。我不确定错误出在哪里，因为其中一部分是 HTML，另一部分是 three.js 脚本。请注意，obj 文件已转换为 JavaScript。我一直在关注这个视频https://www.youtube.com/watch?v=NtRrYUAd8rs，它没有显示整个 html 文本。所以我决定添加https://threejs.org/docs/#manual/en/introduction/Creating-a-scene的 HTML它显示了设置场景的基本文档。一旦我在浏览器中打开 html 文件，就会出现 Uncaught ReferenceError: THREE is not defined 的错误！我发现这个世界上有人能够使用 Three.js 的 UMD 版本解决这个错误，但我看不出它应该如何在 html 文件中说明。您可以在下面查看我的代码；
<html>
<head>
<meta charset="utf-8">
<title>My first three.js app</title>
<style>
body { margin: 0; }
canvas { display: block; }
</style>
</head>
<body>
<script src="Desktop/convert/three.js"></script><script>
// Our Javascript will go here.
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
const renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );
var particleMaterial = new THREE.MeshBasicMaterial();
particleMaterial.map = THREE.ImageUtils.loadTexture('img/convert/china-politics.jpg');
particleMaterial.side = THREE.DoubleSide;
var itmArr = [];
</script>
</body>
</html>