gradio

1
import path from "path";
2
import { defineConfig } from "vite";
3

4
/**
5
 * We bundle the worker file before packaging, while other files are only TS-transpiled.
6
 * The consumer of this package, `@gradio/app`, will be bundled with Vite,
7
 * and Vite only supports module-type WebWorkers (`new Worker("...", { type: "module" })`) to handle `import` in the worker file,
8
 * because in the dev mode it doesn't bundle the worker file and just relies on the browser's native support for module-type workers to resolve the imports.
9
 * However, we need to use `importScripts()` in the worker to load Pyodide from the CDN, which is only supported by classic WebWorkers (`new Worker("...")`),
10
 * while we still want to use `import` in the worker to modularize the code.
11
 * So, we bundle the worker file to resolve `import`s here before exporting, preserving `importScripts()` in the bundled file,
12
 * and load the bundled worker file on `@gradio/app` as a classic WebWorker.
13
 *
14
 * Note: We tried the following approaches, but they failed:
15
 * 1. Just TS-transpile the worker file like other files into `worker.js`, and use it like `new Worker("worker.js")`.
16
 * 	  It failed because `tsc` reserves `importScripts()` and also appends `export {};` to the end of the file to specify it as a module (`https://github.com/microsoft/TypeScript/issues/41513`),
17
 *    however, `importScripts()` is only supported by classic WebWorkers, and `export {};` is not supported by classic WebWorkers.
18
 * 2. Use ESM import instead of `importScripts()`, which is (experimentally?) supported by Pyodide since v0.20.0 (https://pyodide.org/en/stable/project/changelog.html#javascript-package),
19
 *    using `import { loadPyodide } from "https://cdn.jsdelivr.net/pyodide/v0.23.2/full/pyodide.js";` in the worker file, instead of `importScripts(...)`.
20
 *    It was successful in the dev mode, but failed in the prod mode, which has this problem: https://github.com/pyodide/pyodide/issues/2217#issuecomment-1328344562.
21
 */
22

23
export default defineConfig({
24
	build: {
25
		outDir: "dist",
26
		rollupOptions: {
27
			input: path.join(__dirname, "src/webworker/index.ts"),
28
			// Ref: https://github.com/rollup/rollup/issues/2616#issuecomment-1431551704
29
			output: {
30
				entryFileNames: "webworker.js"
31
			}
32
		}
33
	}
34
});
35