10

我的 es6 工作流程使用 babel 和 babel-plugin-transform-es2015-modules-system.js 来转换模块导入/导出以与 system.js 一起使用。我只是对所有 es6 功能使用“绿色”浏览器,除了模块的导入/导出 .. 这是 whatwg 标准,因此不是“es6”。

这适用于遗留(非 es6)库,我可以“导入”我需要的所有 npm 包。不知何故 babel,只有 babel 模块转换,system.js 神奇地工作。

除了三个.js。我尝试了所有三个版本:three.js、three.min.js 和three.modules.js。前两个静默失败,导致“未定义”模块。第三个失败,想要 traceur .. 我猜是类似 system.js 的转换?

那么我需要做什么才能在我的 es6 世界中使用three.js?

我想我可以只使用一个<script>标签和一个全局的三个。或者可能使用汇总/webpack 来消除模块?

但我敢打赌,有一个合理的解决方案。毕竟,three.js 内部使用的是 es6 模块。

4

2 回答 2

14

版本中有一个错误(只有一天!)。我修复了它,但仍然有问题。然而,我确实发现这确实有效:

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;

... ETC

所以你可以只导入你实际需要的模块,或者如上所述:导入所有这些模块

 import * as THREE from 'three.js'

干杯

于 2017-01-11T13:42:33.650 回答