场景三js完全空白，无法创建项目

Question

我有一个大问题，我不明白为什么我不能使用三个js。这几天我一直在尝试不同的方法来使用三个js，但没有成功。我首先通过创建一个新的 porjet 来尝试 Parcel。然后我很快转向bender vite。安装非常顺利，这是我在终端中输入的所有命令：

npm 创建 vite@latest （普通，javascript） npm 安装
npm 添加三个 npm 运行开发

然后，当我转到项目文件夹时，我有文件夹：node_modules、public。文件：.gitgnore、idnex.html、javascript.svg、main、js、package-lock.json、package.json、style.css 我没有碰文件和文件夹中的任何内容。 node_modules 中有一个三文件夹和一个快速文件夹。

这是我放入 main.js 的代码：

import { Scene, WebGLRenderer } from 'three';
import './style.css';

const scene = new Scene();
const renderer = new WebGLRenderer();
renderer.setSize(widnow.innerWidth, window.innerHeight);
renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2))
document.body.appendChild(renderer.domElement);

我的代码编辑器在第一行的“来自”和“三”之间写道： 找不到模块“三”的声明文件。 c:/Users/cerng/Desktop/Three/articles/node_modules/third/build/third.js' 隐式具有“any”类型。

以下是 .json 包中的内容：

{ “名称”：“颗粒”， “私人”：真实， “版本”：“0.0.0”， “类型”：“模块”， “脚本”：{ "dev": "vite", "build": "vite 构建", "preview": "vite 预览" }, “开发依赖项”：{ "@types/三": "^0.160.0", "vite": "^5.0.8" }, “依赖项”：{ “三”：“^0.160.0” } }

我编写的代码应该显示一个全黑的场景，但它仍然是白色的（我使用chrome并且我在边缘尝试过）

我尝试卸载 Three.js 然后重新安装它。 运行此命令：npm install --save-dev @types/三。 我也尝试过其他帖子中提出的解决方案，但他们的问题并不完全相同。

Answer 1

您的代码中有拼写错误

renderer.setSize(widnow.innerWidth, window.innerHeight);

开启：

renderer.setSize(window.innerWidth, window.innerHeight);

…此外调用

render

方法，参数为：

scene

和

camera

。

renderer.render(scene, camera)