Add recordsPath to Webpack so module IDs are consistent across builds

lib/intermediate-representation-dir/production-app.js

@@ -28,8 +28,22 @@ try {
 
 // Install service worker.
 runtime.install({
-  onInstalled () {
-    console.log(`App is ready for offline usage`)
+  onInstalled: () => {
+    console.log("SW Event:", "onInstalled")
+  },
+  onUpdating: () => {
+    console.log("SW Event:", "onUpdating")
+  },
+  onUpdateReady: () => {
+    console.log("SW Event:", "onUpdateReady")
+    runtime.applyUpdate()
+  },
+  onUpdated: () => {
+    console.log("SW Event:", "onUpdated")
+    apiRunner('swOnUpdated')
+  },
+  onUninstalled: () => {
+    console.log("SW Event:", "onUninstalled")
   },
 })
 

lib/utils/serve-build.js

@@ -56,23 +56,26 @@ function startServer (program, launchPort) {
 }
 
 module.exports = (program) => {
-  detect(program.port, (err, _port) => {
+  const port = typeof program.port === 'string'
+    ? parseInt(program.port, 10)
+    : program.port
+
+  detect(port, (err, _port) => {
     if (err) {
       console.error(err)
       process.exit()
     }
 
-    if (program.port !== _port) {
+    if (port !== _port) {
       // eslint-disable-next-line max-len
-      const question = `Something is already running at port ${program.port} \nWould you like to run the app at another port instead? [Y/n] `
+      const question = `Something is already running at port ${port} \nWould you like to run the app at another port instead? [Y/n] `
 
       return rlInterface.question(question, (answer) => {
-        let launchPort = program.port
         if (answer.length === 0 || answer.match(/^yes|y$/i)) {
-          launchPort = _port
+          program.port = _port
         }
 
-        return startServer(program, launchPort)
+        return startServer(program, program.port)
       })
     }
 

lib/utils/webpack.config.js

@@ -110,10 +110,13 @@ module.exports = (program, directory, suppliedStage, webpackPort = 1500, pages =
             __PREFIX_LINKS__: program.prefixLinks,
             __LINK_PREFIX__: JSON.stringify(siteDB().get(`config`).linkPrefix),
           }),
+          // Names module ids with their filepath. We use this in development
+          // to make it easier to see what modules have hot reloaded, etc. as
+          // the numerical IDs aren't useful. In production we use numerical module
+          // ids to reduce filesize.
           new webpack.NamedModulesPlugin(),
           new HardSourceWebpackPlugin({
             cacheDirectory: `${process.cwd()}/.cache/[confighash]`,
-            recordsPath: `${process.cwd()}/.cache/[confighash]/records.json`,
             configHash: (webpackConfig) => stage,
             environmentPaths: {
               root: process.cwd(),
@@ -134,7 +137,6 @@ module.exports = (program, directory, suppliedStage, webpackPort = 1500, pages =
           new ExtractTextPlugin(`styles.css`, { allChunks: true }),
           new HardSourceWebpackPlugin({
             cacheDirectory: `${process.cwd()}/.cache/[confighash]`,
-            recordsPath: `${process.cwd()}/.cache/[confighash]/records.json`,
             configHash: (webpackConfig) => stage,
             environmentPaths: {
               root: process.cwd(),
@@ -156,7 +158,6 @@ module.exports = (program, directory, suppliedStage, webpackPort = 1500, pages =
           new ExtractTextPlugin(`build-html-styles.css`),
           new HardSourceWebpackPlugin({
             cacheDirectory: `${process.cwd()}/.cache/[confighash]`,
-            recordsPath: `${process.cwd()}/.cache/[confighash]/records.json`,
             configHash: (webpackConfig) => stage,
             environmentPaths: {
               root: process.cwd(),
@@ -249,7 +250,6 @@ module.exports = (program, directory, suppliedStage, webpackPort = 1500, pages =
           }),
           new HardSourceWebpackPlugin({
             cacheDirectory: `${process.cwd()}/.cache/[confighash]`,
-            recordsPath: `${process.cwd()}/.cache/[confighash]/records.json`,
             configHash: (webpackConfig) => stage,
             environmentPaths: {
               root: process.cwd(),
@@ -497,6 +497,7 @@ module.exports = (program, directory, suppliedStage, webpackPort = 1500, pages =
     resolveLoader: resolveLoader(),
     plugins: plugins(),
     resolve: resolve(),
+    recordsPath: `${process.cwd()}/.webpack-records/records-${stage}.json`,
   })
 
   return webpackModifyValidate(module, config, stage)

package.json

@@ -43,7 +43,6 @@
     "css-loader": "^0.25.0",
     "debug": "^2.2.0",
     "detect-port": "^1.0.5",
-    "eslint-plugin-import": "^1.16.0",
     "excerpt-html": "^1.1.1",
     "extract-text-webpack-plugin": "^1.0.1",
     "file-loader": "^0.9.0",
@@ -64,6 +63,7 @@
     "loader-utils": "^0.2.16",
     "lodash": "^4.16.5",
     "markdown-it": "^7.0.1",
+    "md5-file": "^3.1.1",
     "mkdirp": "^0.5.1",
     "moment": "^2.15.2",
     "negotiator": "^0.6.1",
@@ -124,7 +124,7 @@
     "eslint-config-airbnb": "^12.0.0",
     "eslint-plugin-flow-vars": "^0.5.0",
     "eslint-plugin-flowtype": "^2.25.0",
-    "eslint-plugin-import": "^2.0.1",
+    "eslint-plugin-import": "^1.16.0",
     "eslint-plugin-jsx-a11y": "^2.2.2",
     "eslint-plugin-react": "^6.3.0",
     "flow-bin": "^0.34.0",