Add Webpack for libraries who needs packing

Tools/DevLoader/BabylonLoader.js

@@ -135,13 +135,18 @@ var BABYLONDEVTOOLS;
                 }
             }
             else if (min) {
-                this.loadScript(babylonJSPath + '/dist/preview release' + module.build.distOutputDirectory + library.output.replace('.js', '.min.js'));
+                if (library.webpack) {
+                    this.loadScript(babylonJSPath + '/dist/preview release' + module.build.distOutputDirectory + library.output.replace('.js', '.bundle.js'));
+                }
+                else {
+                    this.loadScript(babylonJSPath + '/dist/preview release' + module.build.distOutputDirectory + library.output.replace('.js', '.min.js'));
+                }
             }
             else {
                 this.loadScript(babylonJSPath + '/dist/preview release' + module.build.distOutputDirectory + library.output);
             }
 
-            if (library.sassFiles && library.sassFiles.length > 0) {
+            if (!min && library.sassFiles && library.sassFiles.length > 0) {
                 var cssFile = library.output.replace('.js', '.css');
                 cssFile = babylonJSPath + '/dist/preview release' +  module.build.distOutputDirectory + cssFile;
                 this.loadCss(cssFile);
@@ -179,7 +184,10 @@ var BABYLONDEVTOOLS;
             }
             getJson('/Tools/Gulp/config.json',
                 function(data) {
-                    self.loadScript('/dist/split.js');
+                    if (!min) {
+                        self.loadScript('/dist/preview release/split.js');
+                    }
+
                     self.loadBJSScripts(data);
                     if (dependencies) {
                         self.loadScripts(dependencies);

Tools/Gulp/config.json

@@ -313,7 +313,7 @@
         "output": "babylon.skyMaterial.js"
       },
       {
-        "files": ["../../materialsLibrary/src/grid/babylon.gridMaterial.ts"],
+        "files": ["../../materialsLibrary/src/grid/babylon.gridmaterial.ts"],
         "shaderFiles": [
           "../../materialsLibrary/src/grid/grid.vertex.fx",
           "../../materialsLibrary/src/grid/grid.fragment.fx",
@@ -551,7 +551,8 @@
       "sassFiles": [
         "../../inspector/sass/**/*.scss"
       ],
-      "output": "babylon.inspector.js"
+      "output": "babylon.inspector.js",
+      "webpack": "../../inspector/webpack.config.js" 
     }],
     "build": {
       "srcOutputDirectory": "../../inspector/",      

Tools/Gulp/gulpfile.js

@@ -19,6 +19,7 @@ var optimisejs = require('gulp-optimize-js');
 var webserver = require('gulp-webserver');
 var path = require('path');
 var sass = require('gulp-sass');
+var webpack = require('webpack-stream');
 
 var config = require("./config.json");
 var customConfig = require("./custom.config.json");
@@ -264,9 +265,7 @@ var buildExternalLibrary= function(library, settings, watch) {
         return merge2([shader, dev, css]);    
     }
     else {
-        
-        var dist = merge2([dev, css], [
-            merge2([tsProcess.js, shader])
+        var code = merge2([tsProcess.js, shader])
                 .pipe(concat(library.output))
                 .pipe(gulp.dest(outputDirectory))
                 .pipe(cleants())
@@ -275,14 +274,25 @@ var buildExternalLibrary= function(library, settings, watch) {
                 .pipe(rename({extname: ".min.js"}))
                 .pipe(uglify())
                 .pipe(optimisejs())
-                .pipe(gulp.dest(outputDirectory)), 
-            tsProcess.dts
+                .pipe(gulp.dest(outputDirectory));
+        
+        var dts = tsProcess.dts
                 .pipe(concat(library.output))
                 .pipe(rename({extname: ".d.ts"}))
-                .pipe(gulp.dest(outputDirectory)) 
-        ]);
+                .pipe(gulp.dest(outputDirectory));
+
+        var waitAll =  merge2([dev, code, css, dts]);
 
-        return dist;   
+        if (library.webpack) {
+            return waitAll.on('end', function() {
+                webpack(require(library.webpack))
+                    .pipe(rename(library.output.replace(".js", ".bundle.js")))
+                    .pipe(gulp.dest(outputDirectory))
+            });
+        }
+        else {
+            return waitAll;
+        }
     }
 }
 

Tools/Gulp/package.json

@@ -26,7 +26,12 @@
     "gulp-optimize-js": "^1.0.2",
     "gulp-webserver": "^0.9.1",
     "gulp-debug": "^3.0.0",
-    "gulp-sass": "2.3.2"
+    "gulp-sass": "2.3.2",
+    "webpack-stream": "^3.2.0",
+    "css-loader": "^0.25.0",
+    "style-loader": "^0.13.1",
+    "exports-loader": "^0.6.3",
+    "imports-loader": "^0.7.0"
   },
   "scripts": {
     "install": "npm --prefix ../../Playground/ install ../../Playground/ && gulp typescript-compile && gulp typescript-libraries && gulp deployLocalDev"

inspector/webpack.config.js

@@ -0,0 +1,22 @@
+module.exports = {
+    entry: [
+        "../../dist/preview release/inspector/babylon.inspector.css",
+        "../../dist/preview release/inspector/babylon.inspector.min.js"
+    ],
+    output: {
+        libraryTarget: "var",
+        library: "INSPECTOR",
+        umdNamedDefine: true
+    },
+    resolve: {
+        alias: {
+            split: '../split.js'
+        }
+    },
+    module: {        
+        loaders: [
+            { test: /\.css$/, loader: "style!css" },
+            { test: /babylon.inspector.min.js$/, loader: "imports?Split=split!exports?INSPECTOR" }
+        ]
+    }
+}