Three.js项目运行报Uncaught ReferenceError: require is not defined错误

错误产生原因 #

• require() 是 Node.js 环境专属的 CommonJS 模块化语法，浏览器原生运行环境并不支持该语法。你通过 Live Server 直接启动 HTML 页面时，浏览器会直接加载执行 index.js 文件，无法识别 require 方法，因此抛出该引用错误。
• 你当前的项目没有配置 Vite、Webpack 等前端打包工具，无法将 CommonJS 语法转换为浏览器可识别的代码，也无法处理 node_modules 目录下的依赖引用路径。即便你已经在项目中安装了 three 依赖，浏览器也无法直接定位到 node_modules 中的 three 库文件。
• 即便你在 package.json 中添加 "type": "module" 配置也无法解决该问题，该配置仅作用于 Node.js 运行环境，用来告知 Node.js 将 .js 文件识别为 ES 模块规范，对浏览器侧的代码运行无影响。

内容的提问来源于stack exchange，提问作者tan shi yu