Adding Content

As an example: Add a leaflet viewer plugin for geoJSON files.

Go to npm: search for leaflet (success!).
Go to jupyterlab top level source directory: npm install --save leaflet. This adds the file to the dependencies in package.json.
Install the tsd node package globally, in order to fetch typings files: npm install -g tsd.
Try to install the typings files from the top level source directory: tsd install leaflet. (success!)
If there are no typings, we must create our own. An example typings file that exports functions is ansi_up. An example with a class is xterm.
Add a reference to the new library in src/typings.d.ts.
Create a folder in src for the plugin.
Add index.ts and plugin.ts files.
If creating CSS, import them in src/default-themes/index.css.
The index.ts file should have the core logic for the plugin. In this case, it should create a widget and widget factory for rendering geojson files (see Documents).
The plugin.ts file should create the extension and add the content to the application. In this case registering the widget factory using the document registry.
Run npm run build from jupyterlab/jupyterlab
Run jupyter lab and verify changes.

Provide feedback