Bug 1399390 - Use lazy-require in Netmonitor's webpack.config; r=jdescottes draft
authorJan Odvarko <odvarko@gmail.com>
Thu, 14 Sep 2017 10:53:27 +0200
changeset 664702 3e88ddc1bb50f0a267584405e0461c69675b8470
parent 664686 dcb5f41efa3cd17f88aa498c1ac53bac128310dd
child 731509 19105b12dbe56fd6de2b3e5d62ea4988f5b03ceb
push id79769
push userjodvarko@mozilla.com
push dateThu, 14 Sep 2017 08:54:18 +0000
reviewersjdescottes
bugs1399390
milestone57.0a1
Bug 1399390 - Use lazy-require in Netmonitor's webpack.config; r=jdescottes MozReview-Commit-ID: Lt07vlWXLeg
devtools/client/inspector/webpack.config.js
devtools/client/inspector/webpack/rewrite-browser-require.js
devtools/client/inspector/webpack/rewrite-css-logic-importer.js
devtools/client/inspector/webpack/rewrite-event-emitter.js
devtools/client/inspector/webpack/rewrite-lazy-require.js
devtools/client/inspector/webpack/rewrite-react-redux.js
devtools/client/inspector/webpack/rewrite-sdk-lazy-require.js
devtools/client/netmonitor/webpack.config.js
devtools/client/shared/webpack/README.md
devtools/client/shared/webpack/rewrite-browser-require.js
devtools/client/shared/webpack/rewrite-css-logic-importer.js
devtools/client/shared/webpack/rewrite-event-emitter.js
devtools/client/shared/webpack/rewrite-lazy-require.js
devtools/client/shared/webpack/rewrite-react-redux.js
devtools/client/shared/webpack/rewrite-sdk-lazy-require.js
--- a/devtools/client/inspector/webpack.config.js
+++ b/devtools/client/inspector/webpack.config.js
@@ -38,49 +38,49 @@ module.exports = envConfig => {
 
       // Warn for every expression in require
       wrappedContextCritical: true,
 
       loaders: [
         {
           test: /event-emitter/,
           exclude: /node_modules/,
-          loaders: [path.join(__dirname, "./webpack/rewrite-event-emitter")],
+          loaders: ["rewrite-event-emitter"],
         }, {
           test: /client(\/|\\)inspector(\/|\\).*\.js$/,
           loaders: [
             // Replace all references to this.browserRequire() by require()
-            path.join(__dirname, "./webpack/rewrite-browser-require"),
+            "rewrite-browser-require",
             // Replace all references to loader.lazyRequire() by require()
-            path.join(__dirname, "./webpack/rewrite-lazy-require"),
+            "rewrite-lazy-require",
           ],
         }, {
           test: /shared(\/|\\)inspector(\/|\\)css-logic\.js$/,
           loaders: [
             // Replace a very specific lazy importer, which should really be moved to
             // /server ...
-            path.join(__dirname, "./webpack/rewrite-css-logic-importer"),
+            "rewrite-css-logic-importer",
           ],
         }, {
           test: /react-redux\.js$/,
           loaders: [
             // Replace dynamic paths in react-redux file
-            path.join(__dirname, "./webpack/rewrite-react-redux"),
+            "rewrite-react-redux",
           ],
         }, {
           // Replace all references sdk's lazyRequire by require()
           test: /sdk(\/|\\).*\.js$/,
-          loaders: [path.join(__dirname, "./webpack/rewrite-sdk-lazy-require")],
+          loaders: ["rewrite-sdk-lazy-require"],
         }
       ]
     },
     resolveLoader: {
       root: [
         path.resolve("./node_modules"),
-        path.resolve("./webpack"),
+        path.resolve("../shared/webpack"),
       ]
     },
     resolve: {
       alias: {
         "react": "devtools/client/shared/vendor/react",
         "redux": "devtools/client/shared/vendor/redux",
         "react-dom": "devtools/client/shared/vendor/react-dom",
         "acorn/util/walk": path.join(__dirname, "../../shared/acorn/walk"),
--- a/devtools/client/netmonitor/webpack.config.js
+++ b/devtools/client/netmonitor/webpack.config.js
@@ -27,19 +27,28 @@ let webpackConfig = {
         /*
          * The version of webpack used in the launchpad seems to have trouble
          * with the require("raw!${file}") that we use for the properties
          * file in l10.js.
          * This loader goes through the whole code and remove the "raw!" prefix
          * so the raw-loader declared in devtools-launchpad config can load
          * those files.
          */
-        test: /\.js/,
+        test: /\.js$/,
         loader: "rewrite-raw",
       },
+      {
+        test: /\.js$/,
+        loaders: [
+          // Replace all references to this.browserRequire() by require()
+          "rewrite-browser-require",
+          // Replace all references to loader.lazyRequire() by require()
+          "rewrite-lazy-require",
+        ],
+      }
     ]
   },
 
   resolveLoader: {
     modules: [
       path.resolve("./node_modules"),
       path.resolve("../shared/webpack"),
     ]
new file mode 100644
--- /dev/null
+++ b/devtools/client/shared/webpack/README.md
@@ -0,0 +1,29 @@
+# Webpack Support
+This directory contains modules intended to support and customize
+DevTools source bundling.
+
+DevTools use Webpack to generate bundles for individual tools,
+which allow e.g. running them on top of the Launchpad (within
+a browser tab).
+
+Custom loaders implemented in this directory are mostly used to
+rewrite existing code, so it's understandable for Webpack.
+
+For example:
+
+The following piece of code is using `lazyRequireGetter` that
+is unknown to Webpack.
+
+```
+loader.lazyRequireGetter(this, "EventEmitter",
+  "devtools/shared/old-event-emitter");
+```
+
+In order to properly bundle `devtools/shared/old-event-emitter` module
+the code needs to be translated into:
+
+```
+let EventEmitter = require("devtools/shared/old-event-emitter");
+```
+
+See more in `rewrite-lazy-require`
rename from devtools/client/inspector/webpack/rewrite-browser-require.js
rename to devtools/client/shared/webpack/rewrite-browser-require.js
rename from devtools/client/inspector/webpack/rewrite-css-logic-importer.js
rename to devtools/client/shared/webpack/rewrite-css-logic-importer.js
rename from devtools/client/inspector/webpack/rewrite-event-emitter.js
rename to devtools/client/shared/webpack/rewrite-event-emitter.js
rename from devtools/client/inspector/webpack/rewrite-lazy-require.js
rename to devtools/client/shared/webpack/rewrite-lazy-require.js
rename from devtools/client/inspector/webpack/rewrite-react-redux.js
rename to devtools/client/shared/webpack/rewrite-react-redux.js
rename from devtools/client/inspector/webpack/rewrite-sdk-lazy-require.js
rename to devtools/client/shared/webpack/rewrite-sdk-lazy-require.js