Add example of using Vite

[garrettjstevens]

This is similar to #43. Vite can be used to bundle the plugin code, and even though it uses Rollup for the production build, it still builds faster than our custom Rollup config. And it can be configured to use Rolldown, which can be even faster.

Here's an example Vite config that seems to work:

import { dirname, resolve, isAbsolute } from 'node:path'
import { fileURLToPath } from 'node:url'
import { defineConfig } from 'vite'
import globals from '@jbrowse/core/ReExports/list'

function createGlobalMap(jbrowseGlobals: string[], dotSyntax = false) {
  const globalMap: Record<string, string> = {}
  for (const global of jbrowseGlobals) {
    globalMap[global] = dotSyntax
      ? `JBrowseExports.${global}`
      : `JBrowseExports["${global}"]`
  }
  return globalMap
}

const __dirname = dirname(fileURLToPath(import.meta.url))

function external(id: string) {
  if (id.startsWith('regenerator-runtime')) {
    return false
  }
  return !id.startsWith('.') && !isAbsolute(id)
}

export default defineConfig({
  build: {
    lib: {
      entry: resolve(__dirname, 'src/index.ts'),
      name: 'JBrowsePluginTemplate',
      fileName: 'jbrowse-plugin-template',
    },
    rollupOptions: {
      external: (id: string) => {
        const isExternal = external(id)
        if (isExternal && !globals.includes(id)) {
          return false
        }
        return isExternal
      },
      output: {
        globals: createGlobalMap(globals, true),
        exports: 'named',
      },
    },
  },
})

[cmdcolin]

this looks great. I had adapted an older example you made using esbuild for some of my other projects (vite, at least currently, uses esbuild under the hood for dev builds)

#44

should this type of config replace the default here?

[cmdcolin]

the other alternative is maintaining a couple templates, this may be worthwhile to help guide people to different options (minimal vs maximal build system/testing)

[garrettjstevens]

I think maintaining a couple of templates would be good, and possibly easier to maintain as each template can focus on being an example of one thing.

For multiple templates we could have a directory for each template, but then we'd probably want to make this repo no longer be a "GitHub Template", since the whole repo wouldn't be a single template anymore. Or we could have multiple repos that were all templates, and make sure we maintain links from all the templates to the others in the README to aid discoverability.