10

私の es6 のワークフローでは、babel と babel-plugin-transform-es2015-modules-system.js を使用して、system.js で使用するモジュールのインポート/エクスポートのみを変換します。モジュールのインポート/エクスポートを除くすべてのes6機能に「グリーン」ブラウザーを使用するだけです..これはwhatwg標準であるため、「es6」ではありません。

これはレガシー (非 es6) ライブラリでうまく機能し、必要なすべての npm パッケージを「インポート」できます。どういうわけか、babel モジュールのみが変換され、system.js が魔法のように機能します。

three.jsを除いて。three.js、three.min.js、three.modules.jsの3つのリリースすべてで試しました。最初の 2 つは暗黙のうちに失敗し、「未定義」モジュールが生成されます。3番目は失敗し、トレーサーが必要です.. system.jsのような変換だと思いますか?

では、es6 の世界で three.js を使用するにはどうすればよいでしょうか?

<script>タグとグローバルを 3 つだけ使用できると思います。または、おそらくロールアップ/webpack を使用してモジュールを削除しますか?

しかし、合理的な解決策があるに違いありません。結局のところ、three.js は内部で es6 モジュールを使用しています。

4

2 に答える 2

14

リリースにバグがありました (わずか 1 日経過!)。修正しましたが、まだ問題がありました。ただし、これが機能することがわかりました：

import * as THREE from 'etc/three.js'

..しかし、より明白なバージョンでは、

import THREE from 'etc/three.js'
or
import 'etc/three.js'

動作しないようです。

これよりもこれをよく理解しているかどうか教えてください。これはかなりランダムです。

于 2016-10-25T23:47:53.640 に答える
6

私はちょうど同じ問題を抱えていましたが、THREE は THREE をエクスポートするのではなく、すべての異なるモジュールをエクスポートすることに気付きました。エクスポートを含む three.js ファイルのセクションを確認します。

exports.WebGLRenderTargetCube = WebGLRenderTargetCube;
exports.WebGLRenderTarget = WebGLRenderTarget;
exports.WebGLRenderer = WebGLRenderer;
exports.ShaderLib = ShaderLib;
exports.UniformsLib = UniformsLib;
exports.UniformsUtils = UniformsUtils;
exports.ShaderChunk = ShaderChunk;
exports.FogExp2 = FogExp2;
exports.Fog = Fog;
exports.Scene = Scene;
exports.LensFlare = LensFlare;
exports.Sprite = Sprite;
exports.LOD = LOD;
exports.SkinnedMesh = SkinnedMesh;
exports.Skeleton = Skeleton;
exports.Bone = Bone;
exports.Mesh = Mesh;
exports.LineSegments = LineSegments;
exports.Line = Line;
exports.Points = Points;
exports.Group = Group;

...など

したがって、実際に必要なモジュールのみをインポートするか、上記のようにインポートできます。

 import * as THREE from 'three.js'

乾杯

于 2017-01-11T13:42:33.650 に答える