Build scripts and add metrics. (#1061)

modules/addons/package.json

@@ -25,7 +25,10 @@
     "README.md"
   ],
   "sideEffects": false,
-  "scripts": {},
+  "scripts": {
+    "pre-build": "npm run build-bundle && npm run build-bundle -- --env.dev",
+    "build-bundle": "webpack --display=minimal --config ../../scripts/bundle.config.js"
+  },
   "dependencies": {
     "@loaders.gl/core": "1.0.0-alpha.2",
     "@loaders.gl/draco": "1.0.0-alpha.2",

modules/addons/src/bundle.js

@@ -0,0 +1,7 @@
+/* global window, global */
+const moduleExports = require('./index');
+
+const _global = typeof window === 'undefined' ? global : window;
+_global.loaders = _global.luma || {};
+
+module.exports = Object.assign(_global.luma, moduleExports);

modules/constants/package.json

@@ -25,7 +25,7 @@
   ],
   "sideEffects": false,
   "scripts": {
-    "clean": "echo nothing to clean",
-    "build": "echo nothing to build"
+    "pre-build": "npm run build-bundle && npm run build-bundle -- --env.dev",
+    "build-bundle": "webpack --display=minimal --config ../../scripts/bundle.config.js"
   }
 }

modules/constants/src/bundle.js

@@ -0,0 +1,7 @@
+/* global window, global */
+const moduleExports = require('./index');
+
+const _global = typeof window === 'undefined' ? global : window;
+_global.loaders = _global.luma || {};
+
+module.exports = Object.assign(_global.luma, moduleExports);

modules/core/package.json

@@ -24,7 +24,10 @@
     "dist",
     "README.md"
   ],
-  "scripts": {},
+  "scripts": {
+    "pre-build": "npm run build-bundle && npm run build-bundle -- --env.dev",
+    "build-bundle": "webpack --display=minimal --config ../../scripts/bundle.config.js"
+  },
   "dependencies": {
     "@babel/runtime": "^7.0.0",
     "@luma.gl/constants": "7.0.0-beta.9",

modules/core/src/bundle.js

@@ -0,0 +1,7 @@
+/* global window, global */
+const moduleExports = require('./index');
+
+const _global = typeof window === 'undefined' ? global : window;
+_global.loaders = _global.luma || {};
+
+module.exports = Object.assign(_global.luma, moduleExports);

modules/debug/package.json

@@ -25,7 +25,10 @@
     "README.md"
   ],
   "sideEffects": false,
-  "scripts": {},
+  "scripts": {
+    "pre-build": "npm run build-bundle && npm run build-bundle -- --env.dev",
+    "build-bundle": "webpack --display=minimal --config ../../scripts/bundle.config.js"
+  },
   "dependencies": {
     "@luma.gl/constants": "7.0.0-beta.9",
     "glsl-transpiler": "^1.8.5",

modules/debug/src/bundle.js

@@ -0,0 +1,7 @@
+/* global window, global */
+const moduleExports = require('./index');
+
+const _global = typeof window === 'undefined' ? global : window;
+_global.loaders = _global.luma || {};
+
+module.exports = Object.assign(_global.luma, moduleExports);

modules/effects/package.json

@@ -18,6 +18,8 @@
   ],
   "sideEffects": false,
   "scripts": {
+    "pre-build": "npm run build-bundle && npm run build-bundle -- --env.dev",
+    "build-bundle": "webpack --display=minimal --config ../../scripts/bundle.config.js"
   },
   "dependencies": {
     "@luma.gl/constants": "7.0.0-beta.1"

modules/effects/src/bundle.js

@@ -0,0 +1,7 @@
+/* global window, global */
+const moduleExports = require('./index');
+
+const _global = typeof window === 'undefined' ? global : window;
+_global.loaders = _global.luma || {};
+
+module.exports = Object.assign(_global.luma, moduleExports);

modules/glfx/package.json

@@ -19,7 +19,10 @@
     "README.md"
   ],
   "sideEffects": false,
-  "scripts": {},
+  "scripts": {
+    "pre-build": "npm run build-bundle && npm run build-bundle -- --env.dev",
+    "build-bundle": "webpack --display=minimal --config ../../scripts/bundle.config.js"
+  },
   "peerDependencies": {
     "@luma.gl/core": "^7.0.0-beta.1"
   }

modules/glfx/src/bundle.js

@@ -0,0 +1,7 @@
+/* global window, global */
+const moduleExports = require('./index');
+
+const _global = typeof window === 'undefined' ? global : window;
+_global.loaders = _global.luma || {};
+
+module.exports = Object.assign(_global.luma, moduleExports);

modules/gpgpu/package.json

@@ -25,7 +25,10 @@
     "README.md"
   ],
   "sideEffects": false,
-  "scripts": {},
+  "scripts": {
+    "pre-build": "npm run build-bundle && npm run build-bundle -- --env.dev",
+    "build-bundle": "webpack --display=minimal --config ../../scripts/bundle.config.js"
+  },
   "dependencies": {
     "@luma.gl/constants": "7.0.0-beta.9"
   },

modules/gpgpu/src/bundle.js

@@ -0,0 +1,7 @@
+/* global window, global */
+const moduleExports = require('./index');
+
+const _global = typeof window === 'undefined' ? global : window;
+_global.loaders = _global.luma || {};
+
+module.exports = Object.assign(_global.luma, moduleExports);

modules/main/src/bundle.js

@@ -0,0 +1,7 @@
+/* global window, global */
+const moduleExports = require('./index');
+
+const _global = typeof window === 'undefined' ? global : window;
+_global.loaders = _global.luma || {};
+
+module.exports = Object.assign(_global.luma, moduleExports);

modules/shadertools/package.json

@@ -31,7 +31,10 @@
     "README.md"
   ],
   "sideEffects": false,
-  "scripts": {},
+  "scripts": {
+    "pre-build": "npm run build-bundle && npm run build-bundle -- --env.dev",
+    "build-bundle": "webpack --display=minimal --config ../../scripts/bundle.config.js"
+  },
   "dependencies": {
     "@babel/runtime": "^7.0.0",
     "math.gl": "^2.3.0"

modules/shadertools/src/bundle.js

@@ -0,0 +1,7 @@
+/* global window, global */
+const moduleExports = require('./index');
+
+const _global = typeof window === 'undefined' ? global : window;
+_global.loaders = _global.luma || {};
+
+module.exports = Object.assign(_global.luma, moduleExports);

modules/test-utils/package.json

@@ -25,11 +25,8 @@
     "README.md"
   ],
   "scripts": {
-    "clean": "rm -fr dist dist-es6 && mkdir -p dist/es5 dist/esm dist/es6",
-    "build": "npm run clean && npm run build-es6 && npm run build-esm && npm run build-es5",
-    "build-es6": "BABEL_ENV=es6 babel src --config-file ../../babel.config.js --out-dir dist/es6 --source-maps --ignore 'node_modules/'",
-    "build-esm": "BABEL_ENV=esm babel src --config-file ../../babel.config.js --out-dir dist/esm --source-maps --ignore 'node_modules/'",
-    "build-es5": "BABEL_ENV=es5 babel src --config-file ../../babel.config.js --out-dir dist/es5 --source-maps --ignore 'node_modules/'"
+    "pre-build": "npm run build-bundle && npm run build-bundle -- --env.dev",
+    "build-bundle": "webpack --display=minimal --config ../../scripts/bundle.config.js"
   },
   "dependencies": {
     "probe.gl": "^3.0.1"

modules/test-utils/src/bundle.js

@@ -0,0 +1,7 @@
+/* global window, global */
+const moduleExports = require('./index');
+
+const _global = typeof window === 'undefined' ? global : window;
+_global.loaders = _global.luma || {};
+
+module.exports = Object.assign(_global.luma, moduleExports);

modules/webgl-state-tracker/package.json

@@ -21,7 +21,10 @@
     "dist",
     "README.md"
   ],
-  "scripts": {},
+  "scripts": {
+    "pre-build": "npm run build-bundle && npm run build-bundle -- --env.dev",
+    "build-bundle": "webpack --display=minimal --config ../../scripts/bundle.config.js"
+  },
   "dependencies": {
     "@babel/runtime": "^7.0.0",
     "@luma.gl/constants": "7.0.0-beta.9"

modules/webgl-state-tracker/src/bundle.js

@@ -0,0 +1,7 @@
+/* global window, global */
+const moduleExports = require('./index');
+
+const _global = typeof window === 'undefined' ? global : window;
+_global.loaders = _global.luma || {};
+
+module.exports = Object.assign(_global.luma, moduleExports);

modules/webgl/package.json

@@ -28,7 +28,10 @@
     "gl": false,
     "gl/wrap": false
   },
-  "scripts": {},
+  "scripts": {
+    "pre-build": "npm run build-bundle && npm run build-bundle -- --env.dev",
+    "build-bundle": "webpack --display=minimal --config ../../scripts/bundle.config.js"
+  },
   "dependencies": {
     "@babel/runtime": "^7.0.0",
     "@luma.gl/constants": "7.0.0-beta.9",

modules/webgl/src/bundle.js

@@ -0,0 +1,7 @@
+/* global window, global */
+const moduleExports = require('./index');
+
+const _global = typeof window === 'undefined' ? global : window;
+_global.loaders = _global.luma || {};
+
+module.exports = Object.assign(_global.luma, moduleExports);

modules/webgl2-polyfill/package.json

@@ -20,7 +20,10 @@
     "dist",
     "README.md"
   ],
-  "scripts": {},
+  "scripts": {
+    "pre-build": "npm run build-bundle && npm run build-bundle -- --env.dev",
+    "build-bundle": "webpack --display=minimal --config ../../scripts/bundle.config.js"
+  },
   "dependencies": {
     "@babel/runtime": "^7.0.0",
     "@luma.gl/constants": "7.0.0-beta.9"

modules/webgl2-polyfill/src/bundle.js

@@ -0,0 +1,7 @@
+/* global window, global */
+const moduleExports = require('./index');
+
+const _global = typeof window === 'undefined' ? global : window;
+_global.loaders = _global.luma || {};
+
+module.exports = Object.assign(_global.luma, moduleExports);

package.json

@@ -35,7 +35,7 @@
     "bootstrap": "yarn && ocular-bootstrap",
     "start": "echo 'Please see luma.gl website for how to run examples' && open http://uber.github.io/luma.gl/#/documentation/getting-started/examples",
     "clean": "ocular-clean",
-    "build": "ocular-clean && ocular-build",
+    "build": "ocular-clean && lerna run pre-build && ocular-build",
     "cover": "ocular-test cover",
     "lint": "ocular-lint",
     "publish": "ocular-publish",
@@ -46,7 +46,7 @@
     "perf": "ocular-test perf-browser",
     "bench": "ocular-test bench",
     "bench-browser": "ocular-test bench-browser",
-    "metrics": "ocular-metrics"
+    "metrics": "./scripts/metrics.sh && ocular-metrics"
   },
   "devDependencies": {
     "@probe.gl/bench": "^3.0.1",

scripts/bundle.config.js

@@ -0,0 +1,106 @@
+const {resolve} = require('path');
+const webpack = require('webpack');
+
+const ALIASES = require('ocular-dev-tools/config/ocular.config')({
+  aliasMode: 'src',
+  root: resolve(__dirname, '..')
+}).aliases;
+
+const PACKAGE_ROOT = resolve('.');
+const PACKAGE_INFO = require(resolve(PACKAGE_ROOT, 'package.json'));
+
+/**
+ * peerDependencies are excluded using `externals`
+ * https://webpack.js.org/configuration/externals/
+ * e.g. @deck.gl/core is not bundled with @deck.gl/geo-layers
+ */
+function getExternals(packageInfo) {
+  const externals = {
+    // Hard coded externals
+  };
+
+  const {peerDependencies = {}, browser} = packageInfo;
+
+  Object.assign(externals, browser);
+
+  for (const depName in peerDependencies) {
+    if (depName.startsWith('@luma.gl')) {
+      // Instead of bundling the dependency, import from the global `deck` object
+      externals[depName] = 'luma';
+    }
+  }
+
+  return externals;
+}
+
+const NODE = {
+  Buffer: false,
+  fs: 'empty',
+  http: 'empty',
+  https: 'empty',
+  path: 'empty',
+  crypto: 'empty'
+};
+
+const config = {
+  mode: 'production',
+
+  entry: {
+    main: resolve('./src/bundle')
+  },
+
+  output: {
+    libraryTarget: 'umd',
+    path: PACKAGE_ROOT,
+    filename: 'dist/dist.min.js'
+  },
+
+  node: NODE,
+
+  resolve: {
+    alias: ALIASES
+  },
+
+  module: {
+    rules: [
+      {
+        // Compile ES2015 using babel
+        test: /\.js$/,
+        loader: 'babel-loader',
+        include: /src/
+      }
+    ]
+  },
+
+  externals: getExternals(PACKAGE_INFO),
+
+  plugins: [
+    // This is used to define the __VERSION__ constant in core/lib/init.js
+    // babel-plugin-version-inline uses the package version from the working directory
+    // Therefore we need to manually import the correct version from the core
+    // This is called in prepublishOnly, after lerna bumps the package versions
+    new webpack.DefinePlugin({
+      __VERSION__: JSON.stringify(PACKAGE_INFO.version)
+    })
+  ],
+
+  devtool: false
+};
+
+module.exports = (env = {}) => {
+  // console.log(JSON.stringify(env, null, 2));
+
+  if (env.dev) {
+    // Set development mode (no minification)
+    config.mode = 'development';
+    // Remove .min from the name
+    config.output.filename = 'dist/dist.js';
+    // Disable transpilation
+    config.module.rules = [];
+  }
+
+  // NOTE uncomment to display config
+  // console.log('webpack config', JSON.stringify(config, null, 2));
+
+  return config;
+};

scripts/metrics.sh

@@ -0,0 +1,11 @@
+#/bin/sh
+
+echo '# Minified Scripts'
+find modules -name dist.min.js | while read file; do
+    ls -S -lh "$file" | awk '{print $5, $9}'
+done
+
+echo '# Worker sizes'
+find modules -name "*-loader.worker.js" | grep -v src | while read file; do
+    ls -S -lh "$file" | awk '{print $5, $9}'
+done