build!: separate verovio for prod and dev

- Use `wasm` verovio for development (`webpack.config.js`)
- Load from verovio website for production (`webpack.pages-config.js`)
- Remove redundant `webpack.dev.config.js`

Resolves: #1219, #1221

src/VerovioWrapper.ts

@@ -1,26 +1,36 @@
 import { VerovioMessage } from './Types';
 
-
 /**
  * A wrapper around the verovio web worker to permit mocking in tests.
  */
 export default class VerovioWrapper {
   verovioWorker: Worker;
-  constructor () {
-    this.verovioWorker = new Worker(__ASSET_PREFIX__ + 'workers/VerovioWorker-dev.js');
+  constructor() {
+    if (process.env.NODE_ENV === 'production') {
+      this.verovioWorker = new Worker(
+        __ASSET_PREFIX__ + 'workers/VerovioWorker.js'
+      );
+    } else {
+      this.verovioWorker = new Worker(
+        __ASSET_PREFIX__ + 'workers/VerovioWorker-dev.js'
+      );
+    }
   }
 
   /**
    * Set an event listener onto the actual web worker.
    */
-  addEventListener (type: string, handler: EventListenerOrEventListenerObject): void {
+  addEventListener(
+    type: string,
+    handler: EventListenerOrEventListenerObject
+  ): void {
     return this.verovioWorker.addEventListener(type, handler);
   }
 
   /**
    * Send a message to the actual web worker.
    */
-  postMessage (message: VerovioMessage): void {
+  postMessage(message: VerovioMessage): void {
     return this.verovioWorker.postMessage(message);
   }
 }

webpack.config.js

@@ -6,7 +6,7 @@ const HardSourceWebpackPlugin = require('hard-source-webpack-plugin');
 let commitHash = childProcess.execSync('git rev-parse --short HEAD').toString();
 
 module.exports = {
-  mode: 'production',
+  mode: 'development',
   entry: {
     landing: './deployment/scripts/landing.ts',
     editor: './deployment/scripts/editor.ts',
@@ -15,44 +15,42 @@ module.exports = {
   output: {
     path: path.resolve(__dirname, 'deployment', 'server', 'Neon-gh'),
     publicPath: '/',
-    filename: '[name].js'
+    filename: '[name].js',
   },
   node: {
-    fs: 'empty'
+    fs: 'empty',
   },
   devtool: 'inline-source-map',
   module: {
     rules: [
       {
         test: /\.tsx?$/,
-        use: [
-          'ts-loader'
-        ],
-        exclude: /node_modules/
+        use: ['ts-loader'],
+        exclude: /node_modules/,
       },
       {
         test: /Worker\.js$/,
         use: [
           {
             loader: 'worker-loader',
-            options: { publicPath: '/Neon-gh/' }
-          }
-        ]
-      }
-    ]
+            options: { publicPath: '/Neon-gh/' },
+          },
+        ],
+      },
+    ],
   },
   resolve: {
-    extensions: [ '.ts', '.js' ]
+    extensions: ['.ts', '.js'],
   },
   externals: {
-    d3: 'd3'
+    d3: 'd3',
   },
   plugins: [
     new HardSourceWebpackPlugin(),
     new webpack.DefinePlugin({
       __LINK_LOCATION__: JSON.stringify('/'),
       __NEON_VERSION__: JSON.stringify(commitHash),
-      __ASSET_PREFIX__: JSON.stringify('/Neon-gh/')
-    })
-  ]
+      __ASSET_PREFIX__: JSON.stringify('/Neon-gh/'),
+    }),
+  ],
 };