service worker doesn't work on vite

[aidenybai]

rank bippy import below react, even though service worker file exists, not registering

repro: https://stackblitz.com/edit/vitejs-vite-ywcbkokx?file=src%2Fmain.tsx,src%2FApp.tsx&terminal=dev

[Asuka109]

Are you trying to set up the RDH in a service worker instance, or is it something else?

bippy/src/sw.ts

Lines 1 to 28 in 572c78b

	/// <reference lib="webworker" />.
	import './types.js';
	(() => {
	try {
	const NO_OP = () => {};
	const renderers = new Map();
	let id = 0;
	globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__ = {
	checkDCE: NO_OP,
	supportsFiber: true,
	supportsFlight: true,
	hasUnsupportedRendererAttached: false,
	renderers,
	onCommitFiberRoot: NO_OP,
	onCommitFiberUnmount: NO_OP,
	onPostCommitFiberRoot: NO_OP,
	inject(renderer) {
	const nextID = ++id;
	renderers.set(nextID, renderer);
	globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__._instrumentationIsActive = true;
	return nextID;
	},
	_instrumentationIsActive: false,
	};
	} catch {}
	})();

[Asuka109]

I think a common approach is to intercept and parse all HTML requests so that you can inject an initialization script tag into them if you want to use a service worker to register RDH with high priority. As the service worker instance has its own context, the RDH registered here will not affect js context from the main thread.

[pivanov]

Unfortunately, Vite doesn't have a built-in way to specify module load order without plugins or build configuration.

[Asuka109]

Is it acceptable to build a unplugin so that we can add an import 'bippy' statement to the beginning of the /\/node_modules\/react\/index\.js$? So that bippy can be loaded always before react. And no need to take too much time to write transformer plugins.