Using webpack to bundle babylon, and using typescript

[Nikos123]

I'm working on an RTS game called density wars, but am not sure how to include babylon in my build.

 

In my main game file I do this, and babyon is present in my code

require('babylonjs');class Game {numCores:number;defaultY:number;

but when I go to use it, babylon is undefined:

constructor() {var self = this;this.numCores = 6;this.defaultY = 1;// Load BABYLON 3D enginethis.canvas = <HTMLCanvasElement> document.getElementById("glcanvas");this.engine = new BABYLON.Engine(this.canvas, true);this.scene = new BABYLON.Scene(this.engine);

config:

module.exports = {context: __dirname + "/lib",entry: {main: ["./game.ts"]},output: {path: __dirname + "/dist",filename: "density-wars.js"},devtool: "source-map",module: {loaders: [{test: /\.ts$/,loader: 'awesome-typescript-loader'},{ test: /\.css$/, loader: "style-loader!css-loader" }]},resolve: {// you can now require('file') instead of require('file.js')extensions: ['', '.js', '.json']}}

[rodrigop]

Acording to Typescript's external modules imports documentation ( https://github.com/Microsoft/TypeScript/wiki/Modules#going-external )

you should use the import keyword, have you tried that?

[Nikos123]

If I do this:

/// <reference path="../babylonjs.d.ts" />require('../style.css');import BABYLON = require('babylonjs');class Game {

I now get an error:

 

ERROR in /Users/me/WebstormProjects/Density-Wars/lib/game.ts:10:25 

File '/Users/me/WebstormProjects/Density-Wars/babylonjs.d.ts' is not a module.

[Nikos123]

Any ideas? Someone must have used babylonjs with webpack?

[Nikos123]

The only way I can get this to work is to do 

 

<script src="node_modules/babylonjs/babylon.max.js" type="text/javascript"></script>

[Nikos123]

Please see this for the solution

 

http://stackoverflow.com/a/34450634/1339087