import THREE from ‘three’; broken by rollup changes, no default export

Older versions of the npm Three.js build had a default export in the built file:

exports = module.exports = THREE;

This is considered a “default export” in es6 package language. That means you (used to be able to) do this:

import THREE from 'three';

However, in the current rollup version of Three.js, there is no default export. Instead, there are lots of:

	exports.WebGLRenderTargetCube = WebGLRenderTargetCube;
exports.WebGLRenderTarget = WebGLRenderTarget;
exports.WebGLRenderer = WebGLRenderer;

Which is fine, except that this doesn’t allow for the above import syntax, breaking backwards compatibility and also goes against intuitive Javascript package principles. For anyone who hits this problem, you can use the less ideal syntax:

import * as THREE from 'three';

Ping @Rich-Harris. I imagine it’s a fairly easy change to restore backwards compatibility to include a default export?

  • ☑️ Dev
  • ☑️ r82

Author: Fantashit

1 thought on “import THREE from ‘three’; broken by rollup changes, no default export

  1. import * as THREE from 'three';

    …is exactly how you should be importing Three.js in an ES2015 project – THREE is just a namespace. Default exports are for things that ‘do something’ (i.e. functions).

Comments are closed.