Add webpack-extension-reloader (OctoLinker#704)

stefanbuck · web-flow · commit f6cefc3f23b1 · 2019-11-16T13:23:32.000+01:00
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
@@ -19,7 +19,7 @@ To build and run the extension follow these steps.
    * Chrome (Quickstart):
      1. `npm run chrome-open`
    * Chrome (Long Version):
-     1. To build the extension once run `npm run build` or `npm run watch` during development.
+     1. To build the extension once run `npm run build` or `npm start` during development.
      1. Load extension https://developer.chrome.com/extensions/getstarted#unpacked.
 
 [CSS]: https://github.com/OctoLinker/OctoLinker/commit/ccbefb7
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -18,7 +18,7 @@
     "release:amo": "cd dist && npm run patch-permissions && webext submit",
     "release": "npm run release:cws",
     "build": "webpack --mode=production",
-    "watch": "webpack --watch --mode=development",
+    "start": "webpack --watch --mode=development",
     "chrome-open": "npm run build && npm run chrome-launch --",
     "chrome-launch": "node scripts/chrome-launch.js",
     "firefox-open": "npm run build && npm run firefox-launch --",
@@ -66,7 +66,8 @@
     "web-ext": "^3.0.0",
     "webext": "1.9.1-with-submit.1",
     "webpack": "^4.40.2",
-    "webpack-cli": "^3.3.4"
+    "webpack-cli": "^3.3.4",
+    "webpack-extension-reloader": "^1.1.4"
   },
   "optionalDependencies": {
     "fsevents": "2.1.2"
diff --git a/webpack.config.js b/webpack.config.js
@@ -1,6 +1,7 @@
 const path = require('path');
 const webpack = require('webpack');
 const CopyWebpackPlugin = require('copy-webpack-plugin'); // eslint-disable-line
+const ExtensionReloader = require('webpack-extension-reloader');
 
 module.exports = (env, argv) => ({
   mode: 'development',
@@ -17,7 +18,17 @@ module.exports = (env, argv) => ({
   plugins: [
     new CopyWebpackPlugin([{ from: 'assets' }]),
     new webpack.EnvironmentPlugin(['OCTOLINKER_LIVE_DEMO']),
-  ],
+    argv.mode === 'development'
+      ? new ExtensionReloader({
+          port: 9090,
+          reloadPage: true,
+          entries: {
+            contentScript: ['app'],
+            background: 'background',
+          },
+        })
+      : false,
+  ].filter(Boolean),
   module: {
     rules: [
       {
