Merge pull request #10685 from GordonSmith/HPCC-18800-WebPackIV

HPCC-18800 Improve WebPack out of box experience IV

Reviewed-By: Miguel Vazquez <miguel.vazquez@lexisnexis.com>
Reviewed-By: Richard Chapman <rchapman@hpccsystems.com>

esp/src/CMakeLists.txt

@@ -16,7 +16,7 @@
 
 project ( eclwatch ) 
 
-set ( ECLWATCH_BUILD_STRATEGY "" CACHE STRING "Override ECL Watch Build Strategy ('SKIP', 'IF_MISSING')" )
+set ( ECLWATCH_BUILD_STRATEGY "" CACHE STRING "Override ECL Watch Build Strategy ('SKIP', 'IF_MISSING', 'NO_COMPRESS')" )
 if ( "${ECLWATCH_BUILD_STRATEGY}" STREQUAL "SKIP" )
     message ( "-- ECL Watch:  Skipping..." )
 else ()
@@ -48,6 +48,11 @@ else ()
             if ( NOT \"${NODE_ERROR}\" STREQUAL \"\")
                 message ( WARNING \"${NODE_ERROR}\" )
             else ()
+                if ( (\"${CMAKE_BUILD_TYPE}\" STREQUAL \"Debug\") OR (\"${ECLWATCH_BUILD_STRATEGY}\" STREQUAL \"NO_COMPRESS\") )
+                    set ( ECLWATCH_BUILD_MODE \"dev\" )
+                else ()
+                    set ( ECLWATCH_BUILD_MODE \"prod\" )
+                endif ()
                 message ( \"-- ECL Watch:  Rebuilding Site\" )
                 message ( \"---- Build Target: ${ECLWATCH_BUILD_DEST}\" )
                 message ( \"---- Creating out of source build environment\" )
@@ -55,7 +60,7 @@ else ()
                 execute_process ( COMMAND \"${CMAKE_COMMAND}\" -E copy_directory \"${CMAKE_CURRENT_SOURCE_DIR}/.\" \"${ECLWATCH_BUILD_TMP}\")
                 execute_process ( COMMAND \"${CMAKE_COMMAND}\" -E remove_directory \"${ECLWATCH_BUILD_TMP}/node_modules\" )
                 message ( \"---- Installing third party libraries\" )
-                execute_process ( WORKING_DIRECTORY \"${ECLWATCH_BUILD_TMP}\" COMMAND \"npm\" \"install\" OUTPUT_FILE \"${ECLWATCH_BUILD_INSTALL_OUT}\" RESULT_VARIABLE _BUILD_RESULT )
+                execute_process ( WORKING_DIRECTORY \"${ECLWATCH_BUILD_TMP}\" COMMAND \"npm\" \"install\" \"--prefer-offline\" OUTPUT_FILE \"${ECLWATCH_BUILD_INSTALL_OUT}\" RESULT_VARIABLE _BUILD_RESULT )
                 if (_BUILD_RESULT)
                     message ( WARNING \"npm install failed see above and ${ECLWATCH_BUILD_INSTALL_OUT} for details.\" )
                 endif ()
@@ -69,7 +74,7 @@ else ()
                 if (_BUILD_RESULT)
                     message ( WARNING \"npm run compile failed see above for details.\" )
                 endif ()
-                execute_process ( WORKING_DIRECTORY \"${ECLWATCH_BUILD_TMP}\" COMMAND \"npm\" \"-s\" \"run\" \"bundle\" OUTPUT_FILE \"${ECLWATCH_BUILD_BUNDLE_OUT}\" RESULT_VARIABLE _BUILD_RESULT )
+                execute_process ( WORKING_DIRECTORY \"${ECLWATCH_BUILD_TMP}\" COMMAND \"npm\" \"-s\" \"run\" \"bundle\" \"--\" \"--bail\" \"--display\" \"errors-only\" \"--env.build\" \"${ECLWATCH_BUILD_MODE}\" OUTPUT_FILE \"${ECLWATCH_BUILD_BUNDLE_OUT}\" RESULT_VARIABLE _BUILD_RESULT )
                 if (_BUILD_RESULT)
                     message ( WARNING \"npm run bundle failed see above and ${ECLWATCH_BUILD_BUNDLE_OUT} for details.\" )
                 endif ()

esp/src/eclwatch/ESPRequest.js

@@ -95,7 +95,7 @@ define([
             return retVal.then(function (response) {
                 params.load(response);
                 return response;
-            }).catch(function(e) {
+            }).catch(function(error) {
                 params.error(error);
                 return error;
             });

esp/src/eclwatch/LFDetailsWidget.js

@@ -116,6 +116,7 @@ define([
             var context = this;
             var origOnOpen = this.desprayTooltiopDialog.onOpen;
             this.desprayTooltiopDialog.onOpen = function () {
+                var targetRow;
                 if (!context.desprayTargetSelect.initalized) {
                     context.desprayTargetSelect.init({
                         DropZones: true,

esp/src/lws.config.js

@@ -0,0 +1,67 @@
+const debugServerIP = "192.168.3.22";
+module.exports = {
+    port: 8080,
+    rewrite: [
+        {
+            from: "/esp/files/dist/*",
+            to: "/build/dist/$1"
+        },
+        {
+            from: "/esp/files/*",
+            to: "/$1"
+        },
+        {
+            from: "/FileSpray/*",
+            to: "http://" + debugServerIP + ":8010/FileSpray/$1"
+        },
+        {
+            from: "/WsWorkunits/*",
+            to: "http://" + debugServerIP + ":8010/WsWorkunits/$1"
+        },
+        {
+            from: "/main",
+            to: "http://" + debugServerIP + ":8010/main"
+        },
+        {
+            from: "/WsECL/*",
+            to: "http://" + debugServerIP + ":8002/WsECL/$1"
+        },
+        {
+            from: "/WsTopology/*",
+            to: "http://" + debugServerIP + ":8010/WsTopology/$1"
+        },
+        {
+            from: "/WsSMC/*",
+            to: "http://" + debugServerIP + ":8010/WsSMC/$1"
+        },
+        {
+            from: "/ws_machine/*",
+            to: "http://" + debugServerIP + ":8010/ws_machine/$1"
+        },
+        {
+            from: "/ws_account/*",
+            to: "http://" + debugServerIP + ":8010/ws_account/$1"
+        },
+        {
+            from: "/ws_access/*",
+            to: "http://" + debugServerIP + ":8010/ws_access/$1"
+        },
+        {
+            from: "/WsESDLConfig/*",
+            to: "http://" + debugServerIP + ":8010/WsESDLConfig/$1"
+        },
+        {
+            from: "/WsDfu/*",
+            to: "http://" + debugServerIP + ":8010/WsDfu/$1"
+        },
+        {
+            from: "/WsDFUXRef/*",
+            to: "http://" + debugServerIP + ":8010/WsDFUXRef/$1"
+        },
+        {
+            from: "/WsPackageProcess/*",
+            to: "http://" + debugServerIP + ":8010/WsPackageProcess/$1"
+        }
+    ]
+}
+

esp/src/package.json

@@ -13,8 +13,9 @@
     "copy-res-TopoJSON": "cpx \"./node_modules/@hpcc-js/map/TopoJSON/**/*\" ./build/dist/TopoJSON/",
     "copy-res": "npm run copy-res-es6-promise && npm run copy-res-eclwatch-img && npm run copy-res-eclwatch-ecl && npm run copy-res-dojo && npm run copy-res-dojox && npm run copy-res-TopoJSON",
     "compile": "tsc",
-    "bundle": "node node_modules/webpack/bin/webpack.js --bail --display errors-only --config webpack.config.js",
+    "bundle": "node node_modules/webpack/bin/webpack.js --config webpack.config.js",
     "build": "npm run copy-res && npm run compile && npm run bundle",
+    "start:dev": "ws",
     "test": "npm run lint"
   },
   "main": "src/stub.js",
@@ -43,6 +44,7 @@
     "font-awesome": "4.7.0",
     "file-loader": "1.1.5",
     "jshint": "2.9.4",
+    "local-web-server": "2.3.0",
     "rimraf": "2.6.2",
     "style-loader": "0.19.0",
     "tslib": "1.8.0",

esp/src/webpack.config.js

@@ -5,49 +5,10 @@ var path = require("path");
 var webpack = require("webpack");
 var BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
 
-module.exports = {
-    context: __dirname,
-    entry: {
-        stub: "eclwatch/stub",
-        vendor: ["@hpcc-js/graph"] //  Trick CommonsChunkPlugin to move some extra modules into node_modules for a more balanced initial load.
-    },
-    output: {
-        filename: "[name].eclwatch.js",
-        path: path.join(__dirname, "build/dist"),
-        publicPath: "/esp/files/dist/",
-        pathinfo: false
-    },
-    module: {
-        loaders: [
-            {
-                test: /\.(png|jpg|gif)$/,
-                use: [
-                    {
-                        loader: 'url-loader',
-                        options: {
-                            limit: 8192
-                        }
-                    }
-                ]
-            }, {
-                test: /\.css$/,
-                use: ['style-loader', 'css-loader']
-            }, {
-                test: /.(ttf|otf|eot|svg|woff(2)?)(\?[a-z0-9]+)?$/,
-                use: [{
-                    loader: 'file-loader',
-                    options: {
-                        name: '[name].[ext]'
-                    }
-                }]
-            }]
-    },
-    resolve: {
-        alias: {
-            "clipboard": path.resolve(__dirname, 'node_modules/clipboard/dist/clipboard')
-        }
-    },
-    plugins: [
+module.exports = function (env) {
+    const isProduction = env && env.build === "prod";
+
+    const plugins = [
         new DojoWebpackPlugin({
             loaderConfig: require.resolve("./eclwatch/dojoConfig"),
             environment: { dojoRoot: "node_modules" },
@@ -72,28 +33,82 @@ module.exports = {
             minChunks(module, count) {
                 var context = module.context;
                 return context && context.indexOf('node_modules') >= 0;
-            },
+            }
         }),
         new webpack.optimize.CommonsChunkPlugin({
             children: true,
             minChunks: 4
-        }),
-        new webpack.optimize.UglifyJsPlugin({
+        })
+    ];
+
+    if (isProduction) {
+        plugins.push(new webpack.optimize.UglifyJsPlugin({
+            cache: true,
+            parallel: true,
             output: { comments: false },
             compress: { warnings: false },
             sourceMap: false
-        })/*,
-        new BundleAnalyzerPlugin()
-        */
-    ],
-    resolveLoader: {
-        modules: [
-            path.join(__dirname, "node_modules")
-        ]
-    },
-    // devtool: "source-map",
-    node: {
-        process: false,
-        global: false
+        }));
+    }
+
+    return {
+        context: __dirname,
+        entry: {
+            stub: ["eclwatch/stub",
+                "eclwatch/ActivityWidget",
+                "eclwatch/DFUQueryWidget",
+                "eclwatch/QuerySetQueryWidget",
+                "eclwatch/WUDetailsWidget",
+                "eclwatch/WUQueryWidget",
+                "eclwatch/TopologyWidget"
+            ]
+        },
+        output: {
+            filename: "[name].eclwatch.js",
+            path: path.join(__dirname, "build/dist"),
+            publicPath: "/esp/files/dist/",
+            pathinfo: false
+        },
+        module: {
+            loaders: [
+                {
+                    test: /\.(png|jpg|gif)$/,
+                    use: [
+                        {
+                            loader: 'url-loader',
+                            options: {
+                                limit: 8192
+                            }
+                        }
+                    ]
+                }, {
+                    test: /\.css$/,
+                    use: ['style-loader', 'css-loader']
+                }, {
+                    test: /.(ttf|otf|eot|svg|woff(2)?)(\?[a-z0-9]+)?$/,
+                    use: [{
+                        loader: 'file-loader',
+                        options: {
+                            name: '[name].[ext]'
+                        }
+                    }]
+                }]
+        },
+        resolve: {
+            alias: {
+                "clipboard": path.resolve(__dirname, 'node_modules/clipboard/dist/clipboard')
+            }
+        },
+        plugins: plugins,
+        resolveLoader: {
+            modules: [
+                path.join(__dirname, "node_modules")
+            ]
+        },
+        devtool: false,
+        node: {
+            process: false,
+            global: false
+        }
     }
 };