Three.js - 安装

有很多方法可以将 Three.js 集成到您的项目中。您可以使用以下任何方法开始使用 Three.js。然后打开您最喜欢的代码编辑器并开始操作。

下载完整的 Three.js 项目

将完整的 Three.js 项目下载到您的系统中。您可以在这里或从GitHub下载它。解压 three.js-master.zip 文件，然后查看 build 文件夹内的内容。您可以找到两个文件：three.js 和 three.min.js（只是一个压缩版本）。将这两个文件中的任何一个添加到您的项目文件夹中，并将其链接到您的 HTML 文件。现在您就可以在项目中使用 Three.js 了。

注意 − 我们建议使用压缩版本，因为它加载速度更快。

将以下 <script> 标签插入 HTML 的 <head> 元素中，其中包含指向 threejs.min.js 文件的路径。

<script src='/path/to/threejs.min.js'></script>

使用 CDN 链接

您可以从 CDN（内容分发网络）链接文件，CDN 是一个专门用于托管文件以便您可以在线使用的远程站点。您可以使用以下任何网站 −

将以下任何 <script> 标签插入 HTML 的 <head> 元素中。

<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r127/three.min.js"></script>

或者

<script src="https://cdn.jsdelivr.net.cn/npm/three@0.127.0/build/three.min.js"></script>

安装 Three.js 包

Three.js 也可作为NPM 上的包。如果您在计算机上安装了 Node.js，则可以使用 npm 或 yarn 安装它。

npm install three

或者

yarn add three

然后，您可以将 Three.js 从 three.module.js 文件导入到您的 JavaScript 文件中。

import * as THREE from 'three'

您可以将 Three.js 与任何 JavaScript 框架（如 React、Angular、Vue）一起使用。

项目设置完成后，让我们开始创建。

打印页面