Re-use webpack plugin across all packages

docs/installation.md

@@ -16,7 +16,7 @@ assets can be found in the `build/` directory of the
 `@jpmorganchase/perspective` and `@jpmorganchase/perspective-viewer` packages.
 
 When importing from NPM modules, you can use the Perspective Webpack plugin to
-manage the `.worker.*.js` and `.wasm` assets for you.  A sample config:
+manage the `.worker.*.js` and `.wasm` assets for you. A sample config:
 
 ```javascript
 const PerspectivePlugin = require("@jpmorganchase/perspective/webpack-plugin");
@@ -27,12 +27,12 @@ module.exports = {
         filename: "out.js",
         path: "build"
     },
-    plugins: [new PerspectivePlugin()],
+    plugins: [new PerspectivePlugin()]
 };
 ```
 
 Alternatively, you may use the built-in `WorkerHost` Node.js server, host
-the contents of a package's `build/` in your application's build script, or 
+the contents of a package's `build/` in your application's build script, or
 otherwise making sure these directories are visible to your web server, e.g.:
 
 ```javascript

packages/perspective-jupyterlab/src/config/mimerenderer.config.js

@@ -12,11 +12,19 @@ const common = require("@jpmorganchase/perspective/src/config/common.config.js")
 
 module.exports = Object.assign({}, common(), {
     entry: "./src/ts/mimerenderer.ts",
+    module: {
+        rules: [
+            {
+                test: /\.css$/,
+                exclude: ["@jpmorganchase"],
+                use: [{loader: "css-loader"}]
+            },
+            {test: /\.ts?$/, loader: "ts-loader"}
+        ]
+    },
     output: {
         filename: "mime.js",
         libraryTarget: "umd",
         path: path.resolve(__dirname, "../../build")
     }
 });
-
-module.exports.module.rules.push({test: /\.ts?$/, loader: "ts-loader"});

packages/perspective-jupyterlab/src/config/plugin.config.js

@@ -8,16 +8,25 @@
  */
 
 const path = require("path");
-const common = require("@jpmorganchase/perspective/src/config/common.config.js");
+const PerspectivePlugin = require("@jpmorganchase/perspective/webpack-plugin");
+const webpack = require("webpack");
 
-module.exports = Object.assign({}, common(), {
+module.exports = {
     entry: "./src/ts/index.ts",
     externals: ["@jupyter-widgets/base"],
+    plugins: [new webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /(en|es|fr)$/), new PerspectivePlugin()],
+    module: {
+        rules: [
+            {
+                test: /\.css$/,
+                use: [{loader: "css-loader"}]
+            },
+            {test: /\.ts?$/, loader: "ts-loader"}
+        ]
+    },
     output: {
         filename: "index.js",
         libraryTarget: "umd",
         path: path.resolve(__dirname, "../../build")
     }
-});
-
-module.exports.module.rules.push({test: /\.ts?$/, loader: "ts-loader"});
+};

packages/perspective-viewer-highcharts/package.json

@@ -2,14 +2,13 @@
     "name": "@jpmorganchase/perspective-viewer-highcharts",
     "version": "0.2.3",
     "description": "Perspective.js",
-    "main": "build/highcharts.plugin.cjs.js",
-    "directories": {
-        "test": "test"
-    },
+    "main": "src/js/highcharts.js",
     "files": [
-        "build/*"
+        "build/**/*",
+        "src/**/*"
     ],
     "babel": {
+        "ignore": ["test"],
         "presets": [
             [
                 "env",
@@ -35,9 +34,7 @@
         "bench": "npm-run-all bench:build bench:run",
         "bench:build": "echo \"No Benchmarks\"",
         "bench:run": "echo \"No Benchmarks\"",
-        "build:highcharts": "webpack --color --config src/config/highcharts.plugin.config.js",
-        "build:cjs": "webpack --color --config src/config/highcharts.plugin.cjs.config.js",
-        "build": "npm-run-all build:*",
+        "build": "webpack --color --config src/config/highcharts.plugin.config.js",
         "test:build": "cp test/html/* build",
         "watch": "webpack --color --watch --config src/config/highcharts.plugin.config.js",
         "test:run": "jest --silent --color 2>&1",

packages/perspective-viewer-highcharts/src/js/draw.js

@@ -16,7 +16,8 @@ import {COLORS_10, COLORS_20} from "./externals.js";
 import {color_axis} from "./color_axis.js";
 import {make_tree_data, make_y_data, make_xy_data, make_xyz_data, make_xy_column_data} from "./series.js";
 import {set_boost, set_category_axis, set_both_axis, default_config, set_tick_size} from "./config.js";
-import {bindTemplate, detectIE} from "../../../perspective-viewer/src/js/utils";
+import {bindTemplate} from "@jpmorganchase/perspective-viewer/src/js/utils";
+import {detectIE} from "@jpmorganchase/perspective/src/js/utils";
 
 export const PRIVATE = Symbol("Highcharts private");
 

packages/perspective-viewer-hypergrid/package.json

@@ -2,14 +2,13 @@
     "name": "@jpmorganchase/perspective-viewer-hypergrid",
     "version": "0.2.3",
     "description": "Perspective.js",
-    "main": "build/hypergrid.plugin.cjs.js",
-    "directories": {
-        "test": "test"
-    },
+    "main": "src/js/hypergrid.js",
     "files": [
-        "build/*"
+        "build/**/*",
+        "src/**/*"
     ],
     "babel": {
+        "ignore": ["test"],
         "presets": [
             [
                 "env",
@@ -35,9 +34,7 @@
         "bench": "npm-run-all bench:build bench:run",
         "bench:build": "echo \"No Benchmarks\"",
         "bench:run": "echo \"No Benchmarks\"",
-        "build:hypergrid": "webpack --color --config src/config/hypergrid.plugin.config.js",
-        "build:cjs": "webpack --color --config src/config/hypergrid.plugin.cjs.config.js",
-        "build": "npm-run-all build:*",
+        "build": "webpack --color --config src/config/hypergrid.plugin.config.js",
         "test:build": "cp test/html/* build",
         "test:run": "jest --silent --color 2>&1",
         "test": "npm-run-all test:build test:run",

packages/perspective-viewer/package.json

@@ -2,11 +2,13 @@
     "name": "@jpmorganchase/perspective-viewer",
     "version": "0.2.3",
     "description": "Perspective.js",
-    "main": "build/perspective.view.cjs.js",
+    "main": "src/js/view.js",
     "files": [
-        "build/*"
+        "build/**/*",
+        "src/**/*"
     ],
     "babel": {
+        "ignore": ["test"],
         "presets": [
             [
                 "env",
@@ -34,9 +36,8 @@
         "bench:run": "echo \"No Benchmarks\"",
         "build:themes:material": "lessc src/less/material.less | cleancss -O2 > build/material.css 2> /dev/null",
         "build:themes:materialdark": "lessc src/less/material.dark.less | cleancss -O2 > build/material.dark.css 2> /dev/null",
-        "build:webpack:cjs": "webpack --color --config src/config/view.cjs.config.js",
-        "build:webpack:viewer": "webpack --color --config src/config/view.config.js",
-        "build": "npm-run-all build:webpack:* build:themes:*",
+        "build:webpack": "webpack --color --config src/config/view.config.js",
+        "build": "npm-run-all build:webpack build:themes:*",
         "watch": "webpack --color --watch --config src/config/view.config.js",
         "test:build": "cp test/html/* build && cp test/csv/* build && cp test/css/* build",
         "test:run": "jest --silent --color 2>&1",

packages/perspective-viewer/src/js/row.js

@@ -10,11 +10,11 @@
 import _ from "underscore";
 
 import Awesomplete from "awesomplete";
-import awesomplete_style from "awesomplete/awesomplete.css";
+import awesomplete_style from "!!css-loader!awesomplete/awesomplete.css";
 
 import {bindTemplate} from "./utils.js";
 
-import perspective from "@jpmorganchase/perspective/src/js/perspective.parallel.js";
+import perspective from "@jpmorganchase/perspective";
 import template from "../html/row.html";
 
 import style from "../less/row.less";

packages/perspective-viewer/src/js/utils.js

@@ -7,55 +7,7 @@
  *
  */
 
-/**
- * Detect Internet Explorer.
- *
- * Returns
- * -------
- * True if the current script is running in Internet Explorer.
- */
-export function detectIE() {
-    if (typeof window === "undefined") return false;
-    var ua = window.navigator.userAgent;
-    var msie = ua.indexOf("MSIE ");
-    if (msie > 0) {
-        return parseInt(ua.substring(msie + 5, ua.indexOf(".", msie)), 10);
-    }
-    var trident = ua.indexOf("Trident/");
-    if (trident > 0) {
-        var rv = ua.indexOf("rv:");
-        return parseInt(ua.substring(rv + 3, ua.indexOf(".", rv)), 10);
-    }
-    var edge = ua.indexOf("Edge/");
-    if (edge > 0) {
-        return parseInt(ua.substring(edge + 5, ua.indexOf(".", edge)), 10);
-    }
-    return false;
-}
-
-/**
- * Detect Chrome.
- *
- * Returns
- * -------
- * Detect if the current script is running in Chrome.
- */
-export function detectChrome() {
-    var isChromium = window.chrome,
-        winNav = window.navigator,
-        vendorName = winNav.vendor,
-        isOpera = winNav.userAgent.indexOf("OPR") > -1,
-        isIEedge = winNav.userAgent.indexOf("Edge") > -1,
-        isIOSChrome = winNav.userAgent.match("CriOS");
-
-    if (isIOSChrome) {
-        return true;
-    } else if (isChromium !== null && typeof isChromium !== "undefined" && vendorName === "Google Inc." && isOpera === false && isIEedge === false) {
-        return true;
-    } else {
-        return false;
-    }
-}
+import {detectIE} from "@jpmorganchase/perspective/src/js/utils.js";
 
 /**
  * Instantiate a Template DOM object from an HTML text string.

packages/perspective/package.json

@@ -3,7 +3,7 @@
     "version": "0.2.3",
     "description": "Perspective.js",
     "main": "build/perspective.node.js",
-    "browser": "build/es5/perspective.parallel.js",
+    "browser": "src/js/perspective.parallel.js",
     "publishConfig": {
         "access": "public"
     },
@@ -45,9 +45,8 @@
         "bench:run": "node build/benchmark.js",
         "bench": "npm-run-all bench:build bench:run",
         "prebuild": "mkdir -p build",
-        "build": "npm-run-all build:es5 build:webpack",
+        "build": "npm-run-all build:webpack",
         "build:webpack": "npm-run-all -p build:webpack:*",
-        "build:es5": "babel src/js --out-dir build/es5",
         "build:webpack:umd": "webpack --color --config src/config/perspective.config.js",
         "build:webpack:node": "webpack --color --config src/config/perspective.node.config.js",
         "docs": "documentation build src/js/perspective.js -f md --shallow > README.md && cp README.md ../../docs/perspective.md",

packages/perspective/src/config/common.config.js

@@ -1,6 +1,6 @@
 const UglifyJSPlugin = require("uglifyjs-webpack-plugin");
 const webpack = require("webpack");
-const path = require("path");
+const PerspectivePlugin = require("../../webpack-plugin");
 
 const plugins = [new webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /(en|es|fr)$/)];
 
@@ -18,58 +18,12 @@ if (!process.env.PSP_NO_MINIFY && !process.env.PSP_DEBUG) {
 }
 
 module.exports = function(build_worker) {
+    plugins.push(new PerspectivePlugin({build_worker: build_worker}));
     return {
         plugins: plugins,
         devtool: "source-map",
         node: {
             fs: "empty"
-        },
-        resolveLoader: {
-            modules: ["node_modules", path.join(__dirname, "../loader")]
-        },
-        module: {
-            rules: [
-                {
-                    test: /\.css$/,
-                    use: [{loader: "css-loader"}]
-                },
-                {
-                    test: /\.less$/,
-                    use: [{loader: "css-loader"}, {loader: "clean-css-loader", options: {level: 2}}, {loader: "less-loader"}]
-                },
-                {
-                    test: /\.(html)$/,
-                    use: {
-                        loader: "html-loader",
-                        options: {}
-                    }
-                },
-                {
-                    test: /\.(arrow)$/,
-                    use: {
-                        loader: "arraybuffer-loader",
-                        options: {}
-                    }
-                },
-                build_worker
-                    ? {
-                          test: /perspective\.(asmjs|wasm)\.js$/,
-                          use: {loader: "blob_worker_loader", options: {name: "[name].worker.js"}}
-                      }
-                    : {
-                          test: /perspective\.(asmjs|wasm)\.js$/,
-                          use: {loader: "file_worker_loader", options: {name: "[name].js"}}
-                      },
-                {
-                    test: /\.wasm$/,
-                    use: {loader: "cross_origin_file_loader", options: {name: "[name].wasm"}}
-                },
-                {
-                    test: /\.js$/,
-                    exclude: /node_modules\/(?!(\@apache|\@jupyterlab))|psp\.(asmjs|async|sync).js/,
-                    loader: "babel-loader"
-                }
-            ]
         }
     };
 };

packages/perspective/src/config/perspective.node.config.js

@@ -5,7 +5,6 @@ module.exports = Object.assign({}, common(), {
     entry: "./src/js/perspective.node.js",
     target: "node",
     externals: [/^([a-z0-9]|\@(?!apache\-arrow)).*?(?!wasm)$/g],
-    plugins: [],
     node: {
         __dirname: false,
         __filename: false

packages/perspective/src/js/perspective.node.js

@@ -23,7 +23,7 @@ const RESOLVER = typeof __non_webpack_require__ !== "undefined" ? __non_webpack_
 
 const LOCAL_PATH = path.join(process.cwd(), "node_modules");
 
-import wasm from "../../obj/psp.sync.wasm";
+import wasm from "./psp.sync.wasm.js";
 
 const buffer = fs.readFileSync(path.join(__dirname, wasm)).buffer;
 

packages/perspective/src/js/psp.sync.wasm.js

@@ -0,0 +1,2 @@
+import wasm from "../../obj/psp.sync.wasm";
+export default wasm;