Plugin webpack build can't handle static files

[garrettjstevens]

As an example, if in a React component in your plugin you import a png like

import stuffPic from './stuff.png'

and use it like

<img  src={stuffPic}/>

it will be included in the build, but it can't be fetched because it's looking for it locally, not where the plugin is being served from (below JBrowse is on port 3000, the plugin is on port 9000):

You can fix it by adding publicPath to your webpack config, e.g.

config.output.publicPath = 'http://localhost:9000/'

but then that means you have to know where the plugin is going to be hosted when you are building it. I'm not sure if there is a better way. You can also set public path at runtime like

__webpack_public_path__ = process.env.ASSET_PATH

but I don't think that will generally work for us, either.

This would also affect if you had code splitting in your plugin and produced multiple files.

[cmdcolin]

Possible

plugin: {
"path": "http://localhost:9000/plugin.js" << this baseUrl provides publicpath for just this bundle?
}
https://github.com/webpack/webpack/issues/443#issuecomment-54113862

///supply it via jbrowse 2 global?
__webpack_public_path__ = window.thingJBrowse2Supplies
['MyPlugin']

[rbuels]

If we can't get this public path hackery to work, we need to add ChunkSizeLimitPlugin to limit chunks to 1 in the jbrowse-development-tools build.ts to disable webpack code splitting:

https://github.com/GMOD/jbrowse-components/blob/d0619c5849da0d7929dc302f3f228d9142e2170f/packages/development-tools/src/build.ts#L70-L77

[cmdcolin]

this is probably stale, we use rollup now...can put concerns in a different repo i think