esbuild.js

const esbuild = require("esbuild");
const fs = require("fs/promises");
const postcss = require("postcss");
const tailwindcss = require("@tailwindcss/postcss");
const autoprefixer = require("autoprefixer");

const production = process.argv.includes('--production');
const watch = process.argv.includes('--watch');

/**
 * @type {import('esbuild').Plugin}
 */
const esbuildProblemMatcherPlugin = {
	name: 'esbuild-problem-matcher',

	setup(build) {
		build.onStart(() => {
			console.log('[watch] build started');
		});
		build.onEnd((result) => {
			result.errors.forEach(({ text, location }) => {
				console.error(`✘ [ERROR] ${text}`);
				console.error(`    ${location.file}:${location.line}:${location.column}:`);
			});
			console.log('[watch] build finished');
		});
	},
};

/**
 * @type {import('esbuild').Plugin}
 */
const postcssTailwindPlugin = {
	name: 'postcss-tailwind',
	setup(build) {
		build.onLoad({ filter: /\.css$/ }, async (args) => {
			const source = await fs.readFile(args.path, 'utf8');
			const result = await postcss([
				tailwindcss(),
				autoprefixer(),
			]).process(source, {
				from: args.path,
			});

			return {
				contents: result.css,
				loader: 'css',
			};
		});
	},
};

async function main() {
	const extensionCtx = await esbuild.context({
		entryPoints: ['src/main.ts'],
		bundle: true,
		format: 'cjs',
		minify: production,
		sourcemap: !production,
		sourcesContent: false,
		platform: 'node',
		outfile: 'dist/main.js',
		external: ['vscode'],
		logLevel: 'silent',
		plugins: [esbuildProblemMatcherPlugin],
	});

	const webviewCtx = await esbuild.context({
		entryPoints: ['src/webview/settings/main.tsx'],
		bundle: true,
		format: 'iife',
		globalName: 'ZCodeToolsSettingsPanel',
		minify: production,
		sourcemap: !production,
		sourcesContent: false,
		platform: 'browser',
		outfile: 'dist/settings-panel.js',
		logLevel: 'silent',
		plugins: [postcssTailwindPlugin],
	});

	if (watch) {
		await Promise.all([extensionCtx.watch(), webviewCtx.watch()]);
	} else {
		await Promise.all([extensionCtx.rebuild(), webviewCtx.rebuild()]);
		await Promise.all([extensionCtx.dispose(), webviewCtx.dispose()]);
	}
}

main().catch(e => {
	console.error(e);
	process.exit(1);
});