Fix Source maps and VsCode integration

.vscode/tasks.json

@@ -35,8 +35,8 @@
                 },
                 "background": {
                     "activeOnStart": true,
-                    "beginsPattern": "Starting \\'watch\\'",
-                    "endsPattern": "Finished \\'run\\'"
+                    "beginsPattern": "Starting \\'run\\'",
+                    "endsPattern": "Entrypoint babylonjs-gui = babylon.gui.min.js babylon.gui.min.js.map"
                 }
             }
         },

Tools/Gulp/tasks/gulpTasks-libraries.js

@@ -45,6 +45,10 @@ var buildExternalLibrariesMultiEntry = function(libraries, settings, isMin) {
     var wpConfig = require(settings.build.webpack);
     // Create multi entry list.
     wpConfig.entry = { };
+    wpConfig.output.devtoolModuleFilenameTemplate = (info) => {
+        return `webpack://${info.namespace}/${info.resourcePath.replace('../Tools/Gulp/../../', '')}`;
+    };
+
     for (let library of settings.libraries) {
         let name = library.output.replace(isMinOutputName ? ".min.js" : ".js", "");
         wpConfig.entry[name] = path.resolve(wpConfig.context, library.entry);

Tools/Gulp/tasks/gulpTasks-watch.js

@@ -28,8 +28,10 @@ gulp.task("watch", function startWatch() {
                 wpconfig.watch = true;
                 // dev mode and absolute path sourcemaps for debugging
                 wpconfig.mode = "development";
-                wpconfig.output.devtoolModuleFilenameTemplate = "[absolute-resource-path]";
-                //config.stats = "minimal";
+                wpconfig.devtool = "nosources-source-map";
+                wpconfig.output.devtoolModuleFilenameTemplate = (info) => {
+                    return `${info.resourcePath}`.replace('Tools/Gulp/../../', '');
+                };
 
                 var outputDirectory = config.build.tempDirectory + settings.distOutputDirectory;
                 tasks.push(webpackStream(wpconfig, webpack).pipe(gulp.dest(outputDirectory)))

gui/webpack.config.js

@@ -44,12 +44,6 @@ module.exports = {
         }]
     },
     mode: "production",
-    devServer: {
-        contentBase: path.join(__dirname, "dist"),
-        compress: false,
-        //open: true,
-        port: 9000
-    },
     plugins: [
         new HardSourceWebpackPlugin(),
         new webpack.WatchIgnorePlugin([
@@ -57,8 +51,5 @@ module.exports = {
             /\.d\.ts$/,
             /\.fx$/
         ])
-    ],
-    watchOptions: {
-        ignored: [path.resolve(__dirname, './dist/**/*.*'), 'node_modules']
-    }
+    ]
 }

inspector/webpack.config.js

@@ -69,18 +69,13 @@ module.exports = {
                 "css-loader",
                 "sass-loader"
             ]
-        }, {
+        }, 
+        {
             test: /\.css$/,
             use: ['style-loader', 'css-loader']
         }]
     },
     mode: "production",
-    devServer: {
-        contentBase: path.join(__dirname, "dist"),
-        compress: false,
-        //open: true,
-        port: 9000
-    },
     performance: {
         hints: false
     },
@@ -96,8 +91,5 @@ module.exports = {
             filename: "[name].css",
             chunkFilename: "[id].css"
         })
-    ],
-    watchOptions: {
-        ignored: [path.resolve(__dirname, './dist/**/*.*'), 'node_modules']
-    }
+    ]
 }

loaders/webpack.config.js

@@ -19,7 +19,7 @@ module.exports = {
         umdNamedDefine: true
     },
     resolve: {
-        extensions: [".js", '.ts']
+        extensions: ['.ts']
     },
     externals: [
         {
@@ -48,20 +48,11 @@ module.exports = {
         }]
     },
     mode: "production",
-    devServer: {
-        contentBase: path.join(__dirname, "dist"),
-        compress: false,
-        //open: true,
-        port: 9000
-    },
     plugins: [
         new HardSourceWebpackPlugin(),
         new webpack.WatchIgnorePlugin([
             /\.js$/,
             /\.d\.ts$/
         ])
-    ],
-    watchOptions: {
-        ignored: [path.resolve(__dirname, './dist/**/*.*'), 'node_modules']
-    }
+    ]
 }

materialsLibrary/webpack.config.js

@@ -12,14 +12,14 @@ module.exports = {
         filename: 'babylonjs.materials.min.js',
         libraryTarget: 'umd',
         library: {
-            root: ["MATLIB"],
+            root: ["MATERIALS"],
             amd: "babylonjs-materials",
             commonjs: "babylonjs-materials"
         },
         umdNamedDefine: true
     },
     resolve: {
-        extensions: [".js", '.ts']
+        extensions: ['.ts']
     },
     externals: [
         {
@@ -48,12 +48,6 @@ module.exports = {
         }]
     },
     mode: "production",
-    devServer: {
-        contentBase: path.join(__dirname, "dist"),
-        compress: false,
-        //open: true,
-        port: 9000
-    },
     plugins: [
         new HardSourceWebpackPlugin(),
         new webpack.WatchIgnorePlugin([
@@ -62,7 +56,4 @@ module.exports = {
             /\.fx$/
         ])
     ],
-    watchOptions: {
-        ignored: [path.resolve(__dirname, './dist/**/*.*'), 'node_modules']
-    }
 }

postProcessLibrary/webpack.config.js

@@ -12,14 +12,14 @@ module.exports = {
         filename: 'babylonjs.postProcess.min.js',
         libraryTarget: 'umd',
         library: {
-            root: ["PPLIB"],
+            root: ["POSTPROCESSES"],
             amd: "babylonjs-postProcessesLibrary",
             commonjs: "babylonjs-postProcessesLibrary"
         },
         umdNamedDefine: true
     },
     resolve: {
-        extensions: [".js", '.ts']
+        extensions: ['.ts']
     },
     externals: [
         {
@@ -44,12 +44,6 @@ module.exports = {
         }]
     },
     mode: "production",
-    devServer: {
-        contentBase: path.join(__dirname, "dist"),
-        compress: false,
-        //open: true,
-        port: 9000
-    },
     plugins: [
         new HardSourceWebpackPlugin(),
         new webpack.WatchIgnorePlugin([
@@ -57,8 +51,5 @@ module.exports = {
             /\.d\.ts$/,
             /\.fx$/
         ])
-    ],
-    watchOptions: {
-        ignored: [path.resolve(__dirname, './dist/**/*.*'), 'node_modules']
-    }
+    ]
 }

proceduralTexturesLibrary/webpack.config.js

@@ -12,15 +12,14 @@ module.exports = {
         filename: 'babylonjs.proceduralTextures.min.js',
         libraryTarget: 'umd',
         library: {
-            root: ["PTLIB"],
+            root: ["PROCEDURALTEXTURES"],
             amd: "babylonjs-procedural-textures",
             commonjs: "babylonjs-procedural-textures"
         },
-        umdNamedDefine: true,
-        //devtoolModuleFilenameTemplate: "[absolute-resource-path]"
+        umdNamedDefine: true
     },
     resolve: {
-        extensions: [".js", '.ts']
+        extensions: ['.ts']
     },
     externals: [
         {
@@ -45,12 +44,6 @@ module.exports = {
         }]
     },
     mode: "production",
-    devServer: {
-        contentBase: path.join(__dirname, "dist"),
-        compress: false,
-        //open: true,
-        port: 9000
-    },
     plugins: [
         new HardSourceWebpackPlugin(),
         new webpack.WatchIgnorePlugin([
@@ -58,8 +51,5 @@ module.exports = {
             /\.d\.ts$/,
             /\.fx$/
         ])
-    ],
-    watchOptions: {
-        ignored: [path.resolve(__dirname, './dist/**/*.*'), 'node_modules']
-    }
+    ]
 }

serializers/webpack.config.js

@@ -19,7 +19,7 @@ module.exports = {
         umdNamedDefine: true
     },
     resolve: {
-        extensions: [".js", '.ts']
+        extensions: ['.ts']
     },
     externals: [
         {
@@ -48,12 +48,6 @@ module.exports = {
         }]
     },
     mode: "production",
-    devServer: {
-        contentBase: path.join(__dirname, "dist"),
-        compress: false,
-        //open: true,
-        port: 9000
-    },
     plugins: [
         new HardSourceWebpackPlugin(),
         new webpack.WatchIgnorePlugin([
@@ -61,8 +55,5 @@ module.exports = {
             /\.d\.ts$/,
             /\.fx$/
         ])
-    ],
-    watchOptions: {
-        ignored: [path.resolve(__dirname, './dist/**/*.*'), 'node_modules']
-    }
+    ]
 }

src/webpack.config.js

@@ -1,6 +1,5 @@
 const path = require('path');
 const webpack = require('webpack');
-const CleanWebpackPlugin = require('clean-webpack-plugin');
 const HardSourceWebpackPlugin = require('hard-source-webpack-plugin');
 
 module.exports = {
@@ -17,22 +16,13 @@ module.exports = {
             amd: "babylonjs",
             commonjs: "babylonjs"
         },
-        umdNamedDefine: true,
-        //devtoolModuleFilenameTemplate: "[absolute-resource-path]"
+        umdNamedDefine: true
     },
     resolve: {
         modules: ['./'],
         extensions: ['.ts'],
         mainFields: []
     },
-    externals: {
-        babylonjs: {
-            root: "BABYLON",
-            commonjs: "babylonjs",
-            commonjs2: "babylonjs",
-            amd: "babylonjs"
-        }
-    },
     devtool: "source-map",
     module: {
         rules: [{
@@ -45,12 +35,6 @@ module.exports = {
         }]
     },
     mode: "production",
-    devServer: {
-        contentBase: path.join(__dirname, "dist"),
-        compress: false,
-        //open: true,
-        port: 9000
-    },
     plugins: [
         new HardSourceWebpackPlugin(),
         new webpack.WatchIgnorePlugin([
@@ -58,8 +42,5 @@ module.exports = {
             /\.d\.ts$/,
             /\.fx$/
         ])
-    ],
-    watchOptions: {
-        ignored: [path.resolve(__dirname, './dist/**/*.*'), 'node_modules']
-    }
+    ]
 }