# What's the recommended way to do ES6 TypeScript imports?

**URL:** <https://forum.babylonjs.com/t/whats-the-recommended-way-to-do-es6-typescript-imports/16963>\
**Category:** Questions\
**Created:** [December 27, 2020, 5:22pm UTC](https://forum.babylonjs.com/t/whats-the-recommended-way-to-do-es6-typescript-imports/16963 "2020-12-27T17:22:47Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![richardtallent](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/richardtallent/32/10848_2.png) [@richardtallent](https://forum.babylonjs.com/u/richardtallent)\
**Post date:** [December 27, 2020, 5:22pm UTC](https://forum.babylonjs.com/t/whats-the-recommended-way-to-do-es6-typescript-imports/16963/1 "2020-12-27T17:22:47Z")

</div>

I have a fairly simple scene, but the build after tree-shaking, is still over 3.5MB. It’s a modern (ES6) build from TypeScript code using rollup (built under Vite, since I’m working with Vue). `rollup-plugin-analyzer` is showing some surprising bits included, such as `colorPicker`, so I’m wondering if I’m importing correctly.

I’m not using `import * from...`, and since I’m using `MeshBuilder` directly, I don’t have to import any “side effects.”

The docs (here)[[Babylon.js ES6 support with Tree Shaking | Babylon.js Documentation](https://doc.babylonjs.com/divingDeeper/developWithBjs/treeShaking)] show two forms of imports:

```javascript
import { Engine, Scene } from "@babylonjs/core";

```

and

```javascript
import { Engine } from "@babylonjs/core/Engines/engine";
import { Scene } from "@babylonjs/core/scene";

```

Is the second one preferred, especially w/r/t tree-shaking?

(This thread)[[TS ES6 module imports: how to quickly find module to import? - Questions - Babylon.js](https://forum.babylonjs.com/t/ts-es6-module-imports-how-to-quickly-find-module-to-import/8658)] suggests that the latter is the better option, though it requires more work to figure out the individual paths, but before I go replace all of my import statements, I figured I should check here first.

There’s also a note about directly importing individual mesh-building functions rather than importing `MeshBuilder`, so I’m already looking into doing that, but I don’t suspect that is responsible for the majority of my bundle size.

---

<div class="post-metadata">

**Author:** ![richardtallent](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/richardtallent/32/10848_2.png) [@richardtallent](https://forum.babylonjs.com/u/richardtallent)\
**Post date:** [December 27, 2020, 5:50pm UTC](https://forum.babylonjs.com/t/whats-the-recommended-way-to-do-es6-typescript-imports/16963/2 "2020-12-27T17:50:09Z")

</div>

Well, I guess I answered my own question… did the work, and reduced the bundle to 1.2MB! Now I just gotta remember to never directly import directly from `@babylonjs/core` again…