Merge pull request #2514 from vector-im/rav/webpack_olm

Use webpack to copy olm.js

.gitignore

@@ -8,6 +8,6 @@
 /vector/bundle.*
 /vector/emojione/
 /vector/config.json
-/vector/olm.js
+/vector/olm.*
 .DS_Store
 npm-debug.log

package.json

@@ -16,21 +16,19 @@
     "build:modernizr": "modernizr -c .modernizr.json -d src/vector/modernizr.js",
     "build:css": "mkdirp build && catw \"src/skins/vector/css/**/*.css\" -o build/components.css --no-watch",
     "build:compile": "babel --source-maps -d lib src",
-    "build:bundle": "NODE_ENV=production webpack -p lib/vector/index.js vector/bundle.js",
+    "build:bundle": "NODE_ENV=production webpack -p --progress",
-    "build:bundle:dev": "webpack --optimize-occurence-order lib/vector/index.js vector/bundle.js",
+    "build:bundle:dev": "webpack --optimize-occurence-order --progress",
-    "build:staticfiles": "cpx -v node_modules/olm/olm.js vector/",
+    "build": "node scripts/babelcheck.js && npm run build:emojione && npm run build:css && npm run build:bundle",
-    "build": "node scripts/babelcheck.js && npm run build:staticfiles && npm run build:emojione && npm run build:css && npm run build:compile && npm run build:bundle",
+    "build:dev": "npm run build:emojione && npm run build:css && npm run build:bundle:dev",
-    "build:dev": "npm run build:staticfiles && npm run build:emojione && npm run build:css && npm run build:compile && npm run build:bundle:dev",
     "package": "scripts/package.sh",
     "start:emojione": "cpx \"node_modules/emojione/assets/svg/*\" vector/emojione/svg/ -w",
-    "start:js": "webpack -w src/vector/index.js vector/bundle.js",
+    "start:js": "webpack -w --progress",
-    "start:js:prod": "NODE_ENV=production webpack -w src/vector/index.js vector/bundle.js",
+    "start:js:prod": "NODE_ENV=production webpack -w --progress",
     "start:skins:css": "mkdirp build && catw \"src/skins/vector/css/**/*.css\" -o build/components.css",
-    "start:staticfiles": "cpx -Lwv node_modules/olm/olm.js vector/",
     "//cache": "Note the -c 1 below due to https://code.google.com/p/chromium/issues/detail?id=508270",
-    "start": "node scripts/babelcheck.js && parallelshell \"npm run start:staticfiles\" \"npm run start:emojione\" \"npm run start:js\" \"npm run start:skins:css\" \"http-server -c 1 vector\"",
+    "start": "node scripts/babelcheck.js && parallelshell \"npm run start:emojione\" \"npm run start:js\" \"npm run start:skins:css\" \"http-server -c 1 vector\"",
-    "start:prod": "parallelshell \"npm run start:staticfiles\" \"npm run start:emojione\" \"npm run start:js:prod\" \"npm run start:skins:css\" \"http-server -c 1 vector\"",
+    "start:prod": "parallelshell \"npm run start:emojione\" \"npm run start:js:prod\" \"npm run start:skins:css\" \"http-server -c 1 vector\"",
-    "clean": "rimraf build lib vector/olm.js vector/bundle.css vector/bundle.js vector/bundle.js.map vector/webpack.css* vector/emojione",
+    "clean": "rimraf build lib vector/olm.* vector/bundle.* vector/emojione",
     "prepublish": "npm run build:css && npm run build:compile",
     "test": "karma start --single-run=true --autoWatch=false --browsers PhantomJS --colors=false",
     "test:multi": "karma start"

webpack.config.js

@@ -3,6 +3,18 @@ var webpack = require('webpack');
 var ExtractTextPlugin = require("extract-text-webpack-plugin");
 
 module.exports = {
+    entry: {
+        "bundle": "./src/vector/index.js",
+
+        // We ship olm.js as a separate lump of javascript. This makes it get
+        // loaded via a separate <script/> tag in index.html (which loads it
+        // into the browser global `Olm`), and define it as an external below.
+        //
+        // (we should probably make js-sdk load it asynchronously at some
+        // point, so that it doesn't block the pageload, but that is a separate
+        // problem)
+        "olm": "olm/olm.js",
+    },
     module: {
         preLoaders: [
             { test: /\.js$/, loader: "source-map-loader" }
@@ -19,9 +31,15 @@ module.exports = {
             // there is no need for webpack to parse them - they can just be
             // included as-is.
             /highlight\.js\/lib\/languages/,
+
+            // olm takes ages for webpack to process, and it's already heavily
+            // optimised, so there is little to gain by us uglifying it.
+            /olm\/(javascript\/)?olm\.js$/,
         ],
     },
     output: {
+        path: path.join(__dirname, "vector"),
+        filename: "[name].js",
         devtoolModuleFilenameTemplate: function(info) {
             // Reading input source maps gives only relative paths here for
             // everything. Until I figure out how to fix this, this is a
@@ -46,11 +64,6 @@ module.exports = {
         },
     },
     externals: {
-        // olm takes ages for webpack to process, and it's already heavily
-        // optimised, so there is little to gain by us uglifying it. We
-        // therefore use it via a separate <script/> tag in index.html (which
-        // loads it into the browser global `Olm`), and reference it as an
-        // external here.
         "olm": "Olm",
     },
     plugins: [