Replace webpack with esbuild

[fregante]

• Described in 💯 Minor codebase updates and fixes #4008 (comment)

To do:

• JSX pragma: dom-chef
• Test at all
• Add "build done" output after every compilation, related: Specifying plugins via the CLI evanw/esbuild#884 (comment)

Notes:

• It shows a warning: "Ignoring this import because X was marked as having no side effects" on type imports evanw/esbuild#1785

[fregante]

Untested

[fregante]

Space generously gifted by our lint rules 😌

[fregante]

Blocked by

• import.meta.url support evanw/esbuild#1492

🤷‍♂️

[hyrious]

I'll give you 2 plugins to solve import.meta.url and the warning of typed-query-selector:

• replace all import.meta.url to absolute path to the source file
• load typed-query-selector by self, with empty content (so that esbuild won't look at the real package)

import {readFile} from 'node:fs/promises'
import {pathToFileURL} from 'node:url'

const importMeta: esbuild.Plugin = {
	name: 'Import Meta',
	setup(build) {
		build.onLoad({filter: /source.features.\S+\.tsx$/}, async args => {
			let contents = await readFile(args.path, 'utf8');
			contents = contents.replace(
				/\bimport\.meta\.url\b/g,
				JSON.stringify(pathToFileURL(args.path)),
			);
			return { contents, loader: 'default' }
		});
	},
};

const TypedQuerySelector: esbuild.Plugin = {
	name: 'typed-query-selector',
	setup(build) {
		build.onResolve({filter: /^typed-query-selector$/}, ({path}) => {
			return { path, namespace: 'typed-query-selector' };
		});
		build.onLoad({filter: /()/, namespace: 'typed-query-selector'}, (a) => {
			return { contents: '', loader: 'js' };
		});
	},
}

Note that it may not pass type checking, but you can know what it do.

[fregante]

Thank you!