Allow importing CSS

[cmdcolin]

Some modules, example: molstar, work best if you can import a css file. In webpack, requires a css-loader

In rollup, may require a different loader

May be able to output a 'chunk of js that writes a style tag'

[cmdcolin]

this is an example of injecting css via javascript code from an esbuild plugin

// from https://github.com/evanw/esbuild/issues/2110#issuecomment-1079934680
const StyleLoader = {
  name: 'inline-style',
  setup({ onLoad }) {
    const template = css =>
      `typeof document<'u'&&` +
      `document.head.appendChild(document.createElement('style'))` +
      `.appendChild(document.createTextNode(${JSON.stringify(css)}))`
    onLoad({ filter: /\.css$/ }, async args => {
      let css = await fs.promises.readFile(args.path, 'utf8')
      return {
        contents: template(css),
      }
    })
  },
}

i am trying it out with the protein3d plugin...will probably want a similar snippet for rollup

[cmdcolin]

the alternative to this would probably be having a similar snippet that injects a "link" tag for the style, and then allowing the plugin to refer to both a css and js file(?)

[cmdcolin]

way that i ended up using was just taking the snippet in the above and using it raw in the source code, instead of relying on specialized css filenames...then i don't need e.g. a specialized config for rollup and esbuild