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/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.module.js 文件中的 Three.js 导入到您的 JavaScript 文件中

import * as THREE from 'three'

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

完成项目设置后,让我们开始创作吧。