How to Reference Three.js in a Power BI Custom Visual Project

Here’s how to reference three.js in your Power BI Custom Visual project.

I have not tested to see if three.js actually works on, but this is how to resolve reference issues.

1. Setup your dev environment by following the instructions in this post: Power BI Custom Visual Dev Environment Setup Quickstart

2. Create visual and navigate to the new directory.

pbiviz new threejstest
cd threejstest

3. Install three.js

npm i three --save

4. Install typings

npm i -g typings

5. Install three typings

typings install dt~three --save --global

6. Open in VS Code (or any editor)

code .

7. Open tsconfig.json and add references to the three.js files

"compilerOptions": {
"allowJs": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "ES5",
"sourceMap": true,
"out": "./.tmp/build/visual.js"
"files": [

8. Add three.d.ts to /src folder and copy this code to that file

declare var three: any;

9. Open src/visual.ts and add this line to the top of the file

/// <amd-dependency path='three'>

10. Instantiate a new THREE.Scene(); object in your constructor

let scene = new THREE.Scene();