Is AMD compilation old and Three.js does not support it?

Questions
1

AMD is not deprecated but It seems that Three.js modules does not support it. For example, THREE.GLTFLoader module.

2

AMD modules date back to around the time of CommonJS modules. They were never implemented by the JavaScript language (only by third-party libraries like RequireJS), and as such will never be deprecated by the JavaScript language.

ES Modules are the modern replacement for both, and are officially part of the JavaScript language. Three.js provides ES modules, such as examples/jsm/loaders/GLTFLoader.js.

We’ve discussed providing UMD modules with threejs — which are backward-compatible with both AMD and CommonJS — but the decision has been to not do that, and move toward ES modules alone, eventually removing the examples/js/* folder and keeping only examples/jsm/*. This avoids a considerable amount of maintenance hassle.

If you need AMD/CommonJS/UMD modules, you can create them using tools like Rollup.

3 Likes
3

I study Three.js and Babylon.js. I need to place my TypeScript examples on Plunker (this is a playground for TS). I can place multiple files on Plunker only with AMD compilation. Is it possible to use Three.js GLTFLoader with Require.js? I see that GLTFLoader contains THREE namespace and It is a problem. The same problem is with OrbitControl. I tried to find example using “shim” but I could not find it.

Three.js works on Plunker but only without OrbitControl and GLTFLoader: https://next.plnkr.co/edit/YXLIamSsUH8k1E3r?preview

Babylon.js has OrbitControl too but it works on Plunker: https://next.plnkr.co/edit/YMWU5JxZ4R5b7NOSy2o4?preview

4

GLTFLoader works well with Babylon.js and Require.js. I placed the TypeScript example on Playground: https://next.plnkr.co/edit/WEMBjkkJJbHgVPVJ?open=MyScene.ts&preview

Could someone place on Playground the same TypeScript example using Three.js and Require.js? You can use something instead Require.js to load AMD modules on Plunker.

5

Is my task not possible? Can I not create a TypeScript example with GLTFLoader using Require.js (or using another AMD loader) on Plunker?

I tried to install three-gltf-loader but I see the error message:

> Uncaught ReferenceError: module is not defined
>     at GLTFLoader.js:3195

Open debug console and you will see this error on Playground: https://next.plnkr.co/edit/RIOMNzHTSjHjoj1s?preview

6

No version of GLTFLoader provided by three.js uses AMD or UMD modules, which you would need to include it with Require.js. If you need it to work with Require.js, you’ll have to create a new version of GLTFLoader yourself. Tools like rollup can help with that, but I don’t have an example to give you.

1 Like
7

Also note that plunkr and TypeScript out to support ES Module syntax, I would think. See https://embed.plnkr.co/plunk/kRY8U1. I don’t use Plunkr but it may be worth looking more into that.

1 Like
8

It is hard for me now. I do not have a time for it and I do not have required skills. I will have to create a new version of OrbitControl and another modules too. I will use Babylon.js because it is more friendly with Require.js and TypeScript. It allows to public my examples with a few classes on Plunker Playground. I write my own little 2D/3D graphics/games engine in pure WebGL and TypeScript. When I will be more skilled I will try to solve this problem.