Configuring plugins

In jbrowse-web and jbrowse-desktop, plugins can be added using the config.json. Note that with our embedded components, you will likely use a different method than described in this article: see https://jbrowse.org/storybook/lgv/main/?path=/story/using-plugins--page

External plugins can be added to the config.json file like so:

{
  "plugins": [
    {
      "name": "GDC",
      "url": "https://unpkg.com/jbrowse-plugin-gdc/dist/jbrowse-plugin-gdc.umd.production.min.js"
    }
  ]
}

Our plugin store lists unpkg URLs for published plugins at https://jbrowse.org/jb2/plugin_store/. You can also download plugin files from those URLs to your own server.

The url field shown above is the simplest option and is equivalent to umdUrl. There are additional fields available for different situations:

Field	Module format	Path resolved relative to
url	UMD	index.html
umdUrl	UMD	index.html
umdLoc	UMD	config.json
esmUrl	ESM	index.html
esmLoc	ESM	config.json
cjsUrl	CJS	index.html (desktop only)

Use umdLoc or esmLoc when your plugin file lives alongside your config.json rather than at the app root. Use esmUrl/esmLoc for a pure ESM module. Use cjsUrl for jbrowse-desktop, since Electron does not support ESM and the jbrowse-plugin-template outputs CJS-specific code for desktop.

umdLoc example

{
  "plugins": [
    {
      "name": "MyPlugin",
      "umdLoc": { "uri": "plugin.js" }
    }
  ]
}

esmUrl example

{
  "plugins": [
    {
      "name": "MyPlugin",
      "esmUrl": "https://unpkg.com/my-plugin/dist/index.mjs"
    }
  ]
}

Plugin store

We recommend developers that create plugins add their plugins to our plugin store: https://github.com/GMOD/jbrowse-plugin-list you can create a PR to add your plugin there.

You can verify the plugin is installed properly by checking the Plugin Store:

Example screenshot showing how installed plugins are represented in the plugin store interface. Plugins installed via the config are shown with a lock icon, indicating they cannot be removed via the GUI.

See our developer guide for more information on developing plugins, or our plugins page to browse currently published plugins.