Merge 5896bb7 into 259bedb

bindings/python/pydeck/README.md

@@ -39,7 +39,7 @@ python setup.py install
 
 First, run `yarn bootstrap` at the root of this repository.
 
-Run `npx webpack-dev-server` in the `modules/jupyter-widget` and in a separate terminal `export PYDECK_DEV_SERVER=http://localhost:8080`.
+Run `yarn watch` in the `modules/jupyter-widget` and in a separate terminal `export PYDECK_DEV_SERVER=http://localhost:8080`.
 
 To specifiy a non-default URL for the webpack dev server, you can set a URL in the `PYDECK_DEV_SERVER` environment variable,
 e.g., `export PYDECK_DEV_SERVER=http://localhost:8080`.

bindings/python/pydeck/dependency_managers/__init__.py

@@ -49,12 +49,14 @@ def create_notebook_requirejs(dependencies, base_path, setup_environment='develo
     if setup_environment == 'development' and dev_server_url:
         # Notebook with hot reloading development on http://localhost:8080
         dependencies['paths']['nbextension/pydeck'] = dev_server_url
+        dependencies['paths']['deck.gl'] = dev_server_url + '/deckgl.dev'
     elif setup_environment in ('test', 'production', 'development'):
         # Notebook using the JS bundle built from webpack command in @deck.gl/jupyter-widget
         # The notebook dependency manager will be written to ./pydeck/nbextension/static/extensionRequires.js
         # If this changes, ./pydeck/nbextension/__init__.py must also change
-        dependencies['map']['*']['@deck.gl/jupyter-widget'] = 'nbextensions/pydeck/index'
-        del dependencies['paths']['nbextension/pydeck']
+        deckgl_version = get_deckgl_version()
+        DECK_CDN_URL = 'https://unpkg.com/deck.gl@{}/dist.min'.format(deckgl_version)
+        dependencies['paths']['deck.gl'] = DECK_CDN_URL
     else:
         raise Exception('Unrecognized setup environment')
 
@@ -73,12 +75,15 @@ def create_standalone_render_requirejs(dependencies, base_path, setup_environmen
     if setup_environment == 'development' and dev_server_url:
         # Supports standalone HTML renderer with hot reloading
         dependencies['paths']['nbextension/pydeck'] = dev_server_url
+        dependencies['paths']['deck.gl'] = dev_server_url + '/deckgl.dev'
     # TODO verify this path
     elif setup_environment == 'production':
         # Standalone HTML renderer in production requires reading from CDN
         deckgl_version = get_deckgl_version()
-        CDN_URL = 'https://cdn.jsdelivr.net/npm/@deck.gl/jupyter-widget@{}/dist'.format(deckgl_version)
+        CDN_URL = 'https://unpkg.com/@deck.gl/jupyter-widget@{}/dist'.format(deckgl_version)
         dependencies['paths']['nbextension/pydeck'] = CDN_URL
+        DECK_CDN_URL = 'https://unpkg.com/deck.gl@{}/dist.min'.format(deckgl_version)
+        dependencies['paths']['deck.gl'] = DECK_CDN_URL
     elif setup_environment == 'development':
         # Standalone HTML renderer with static reloading requires a bundled JS file of the Jupyter widget module
         dependencies['paths']['nbextension/pydeck'] = WIDGET_PATH

bindings/python/pydeck/requirejs_dependencies.json

@@ -5,10 +5,9 @@
     }
   },
   "paths": {
-    "nbextension/pydeck": "",
-    "deckgl": "https://cdn.jsdelivr.net/npm/deck.gl@~7.2.0/dist/dist.dev",
-    "mapboxgl": "https://api.tiles.mapbox.com/mapbox-gl-js/v0.53.1/mapbox-gl",
-    "h3": "https://unpkg.com/h3-js@3.4.3/dist/h3-js.umd",
-    "S2": "https://unpkg.com/s2-geometry@1.2.10/src/s2geometry"
+    "deck.gl": "https://unpkg.com/deck.gl/dist.min",
+    "mapbox-gl": "https://api.tiles.mapbox.com/mapbox-gl-js/v1.2.1/mapbox-gl.js",
+    "h3": "https://unpkg.com/h3-js@^3.4.3/dist/h3-js.umd",
+    "S2": "https://unpkg.com/s2-geometry@^1.2.10/src/s2geometry"
   }
 }

modules/jupyter-widget/package.json

@@ -23,7 +23,9 @@
   ],
   "sideEffects": false,
   "scripts": {
-    "build": "webpack"
+    "watch": "(cd ../main && npm run build-bundle -- --env.dev) && ln -f ../main/dist/dist.dev.js ./dist/deckgl.dev.js && webpack-dev-server --env.dev --port 8080",
+    "build": "webpack",
+    "prepublishOnly": "webpack"
   },
   "dependencies": {
     "@jupyter-widgets/base": "^1.1.10"

modules/jupyter-widget/src/widget.js

@@ -1,4 +1,4 @@
-/* global requirejs, document */
+/* global document */
 import {DOMWidgetModel, DOMWidgetView} from '@jupyter-widgets/base';
 
 import {MODULE_NAME, MODULE_VERSION} from './version';
@@ -82,35 +82,37 @@ function updateDeck(inputJSON, {jsonConverter, deckConfig}) {
 }
 
 export function initDeck({mapboxApiKey, container, jsonInput}) {
-  requirejs(['deckgl', 'mapboxgl', 'h3', 'S2'], (deckgl, mapboxgl) => {
-    try {
-      const layersDict = {};
-      const layers = Object.keys(deckgl).filter(
-        x => x.indexOf('Layer') > 0 && x.indexOf('_') !== 0
-      );
-      layers.map(k => (layersDict[k] = deckgl[k]));
+  require(['mapbox-gl', 'h3', 'S2'], mapboxgl => {
+    require(['deck.gl'], deckgl => {
+      try {
+        const layersDict = {};
+        const layers = Object.keys(deckgl).filter(
+          x => x.indexOf('Layer') > 0 && x.indexOf('_') !== 0
+        );
+        layers.map(k => (layersDict[k] = deckgl[k]));
 
-      const jsonConverter = new deckgl._JSONConverter({
-        configuration: {
-          layers: layersDict
-        }
-      });
+        const jsonConverter = new deckgl._JSONConverter({
+          configuration: {
+            layers: layersDict
+          }
+        });
 
-      const deckConfig = new deckgl.DeckGL({
-        map: mapboxgl,
-        mapboxApiAccessToken: mapboxApiKey,
-        latitude: 0,
-        longitude: 0,
-        zoom: 1,
-        container,
-        onLoad: () => updateDeck(jsonInput, {jsonConverter, deckConfig})
-      });
-      return {jsonConverter, deckConfig};
-    } catch (err) {
-      // This will fail in node tests
-      // eslint-disable-next-line
-      console.error(err);
-    }
-    return {};
+        const deckConfig = new deckgl.DeckGL({
+          map: mapboxgl,
+          mapboxApiAccessToken: mapboxApiKey,
+          latitude: 0,
+          longitude: 0,
+          zoom: 1,
+          container,
+          onLoad: () => updateDeck(jsonInput, {jsonConverter, deckConfig})
+        });
+        return {jsonConverter, deckConfig};
+      } catch (err) {
+        // This will fail in node tests
+        // eslint-disable-next-line
+        console.error(err);
+      }
+      return {};
+    });
   });
 }

modules/jupyter-widget/webpack.config.js

@@ -1,8 +1,10 @@
 // File leans heavily on configuration in
 // https://github.com/jupyter-widgets/widget-ts-cookiecutter/blob/master/%7B%7Bcookiecutter.github_project_name%7D%7D/webpack.config.js
 const path = require('path');
+const packageVersion = require('./package.json').version;
+const webpack = require('webpack');
 
-module.exports = {
+const config = {
   /**
    * Embeddable @deck.gl/jupyter-widget bundle
    *
@@ -20,9 +22,6 @@ module.exports = {
     libraryTarget: 'amd'
   },
   devtool: 'source-map',
-  devServer: {
-    contentBase: path.join(__dirname, 'dist')
-  },
   module: {
     rules: [
       {
@@ -44,9 +43,28 @@ module.exports = {
     ]
   },
   // Packages that shouldn't be bundled but loaded at runtime
-  externals: ['@jupyter-widgets/base'],
+  externals: ['@jupyter-widgets/base', 'deck.gl', 'mapbox-gl', 'h3', 'S2'],
   plugins: [
     // Uncomment for bundle size debug
     // new (require('webpack-bundle-analyzer')).BundleAnalyzerPlugin()
   ]
 };
+
+module.exports = env => {
+  if (env && env.dev) {
+    config.mode = 'development';
+    config.devServer = {
+      contentBase: path.join(__dirname, 'dist')
+    };
+  } else {
+    config.mode = 'production';
+  }
+
+  config.plugins.push(
+    new webpack.DefinePlugin({
+      __VERSION__: JSON.stringify(packageVersion)
+    })
+  );
+
+  return config;
+};