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.js 從 three.module.js 檔案匯入到您的 JavaScript 檔案中。

import * as THREE from 'three'

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

專案設定完成後，讓我們開始建立。

列印頁面