モジュールインポートによるthree.js共有の例

この記事では主に、three.js のモジュールによる中国語ドキュメントの学習とインポートに関する関連情報をサンプル コードを通じて詳しく紹介します。必要な人は以下のエディタで学習しましょう。

前書き

この記事では主に、モジュールを介してインポートされたthree.jsに関する関連コンテンツを紹介します。スクリプトタグを介してthree.jsをインポートすることは、長期的に更新されるプロジェクトを開始して実行するための良い方法です。例:

• プロジェクトのソース コードの一部としてライブラリのコピーを手動で呼び出してインポートする必要があります。

• ライブラリのバージョンの更新は手動プロセスです

• ライブラリの新しいバージョンを導入すると、バージョン管理の違いがソースファイルとめちゃくちゃになります

NPMのような依存関係マネージャーを使用すると、これらのバージョン管理の問題による不備を回避します。

NPM によるインストール

three.js は npm モジュールとしてリリースされました。詳細については、npm を参照してください。 npm のアンインストールとインストールについては、次の記事を参照してください: http://www.jb51.net/article/90518.htm インストールが成功したら、ここでは詳しく説明しません。 npm install three を実行する必要があります。three.js がプロジェクトに含まれます。

モジュールのインポート

Webpack または Browserify のパッケージ化ツールを使用すると、コード内で require('modules') を使用して、パッケージ化されたすべての依存関係を参照できるようになります。

これで、ソース コードにモジュールをインポートし、通常どおり続行できるようになります。

var THREE = require('three');
var scene = new THREE.Scene();

ES6 インポート構文を使用することもできます

import * as THREE from 'three';

const scene = new THREE.Scene();

、または、Scene のインポートなど、three.js ライブラリの一部をインポートすることもできます:

import {Scene} from 'three';
const scene = new Scene();

警告

現在、「例」にあるすべてをインポートすることはできません/js」ディレクトリのドキュメント。これは、一部のファイルがグローバル名前空間 THREE に依存しており、汚染を引き起こしていることが原因です。詳細については、モジュール #9562 をサポートするためのサンプル/js の変換を参照してください。

関連する推奨事項:

必要な関数を実装するための Python モジュールのインポート

three.js をローカルで実行する方法の詳細な説明

JSライブラリ Three.js 基本入門

以上がモジュールインポートによるthree.js共有の例の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。