Combine esbuild scripts (#184531)

* Combine esbuild scripts

This combines the various build scripts used for building webview/notebook content. This should make it easier to update settings for them

As part of this, I also fixed the script so that on watch it restarts automatically on syntax errors instead of exiting

* Migrate other build script

* Fixing math build script

extensions/esbuild-webview-common.js

@@ -0,0 +1,91 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the MIT License. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+// @ts-check
+
+/**
+ * @fileoverview Common build script for extension scripts used in in webviews.
+ */
+
+const path = require('path');
+const esbuild = require('esbuild');
+
+/**
+ * @typedef {Partial<import('esbuild').BuildOptions> & {
+ * 	entryPoints: string[] | Record<string, string> | { in: string, out: string }[];
+ * 	outdir: string;
+ * }} BuildOptions
+ */
+
+/**
+ * Build the source code once using esbuild.
+ *
+ * @param {BuildOptions} options
+ * @param {(outDir: string) => unknown} [didBuild]
+ */
+async function build(options, didBuild) {
+	await esbuild.build({
+		bundle: true,
+		minify: true,
+		sourcemap: false,
+		format: 'esm',
+		platform: 'browser',
+		target: ['es2020'],
+		...options,
+	});
+
+	await didBuild?.(options.outdir);
+}
+
+/**
+ * Build the source code once using esbuild, logging errors instead of throwing.
+ *
+ * @param {BuildOptions} options
+ * @param {(outDir: string) => unknown} [didBuild]
+ */
+async function tryBuild(options, didBuild) {
+	try {
+		await build(options, didBuild);
+	} catch (err) {
+		console.error(err);
+	}
+}
+
+/**
+ * @param {{
+ * 	srcDir: string;
+ *  outdir: string;
+ *  entryPoints: string[] | Record<string, string> | { in: string, out: string }[];
+ * 	additionalOptions?: Partial<import('esbuild').BuildOptions>
+ * }} config
+ * @param {string[]} args
+ * @param {(outDir: string) => unknown} [didBuild]
+ */
+module.exports.run = function (config, args, didBuild) {
+	let outdir = config.outdir;
+
+	const outputRootIndex = args.indexOf('--outputRoot');
+	if (outputRootIndex >= 0) {
+		const outputRoot = args[outputRootIndex + 1];
+		const outputDirName = path.basename(outdir);
+		outdir = path.join(outputRoot, outputDirName);
+	}
+
+	/** @type {BuildOptions} */
+	const resolvedOptions = {
+		entryPoints: config.entryPoints,
+		outdir,
+		...(config.additionalOptions || {}),
+	};
+
+	const isWatch = args.indexOf('--watch') >= 0;
+	if (isWatch) {
+		tryBuild(resolvedOptions);
+
+		const watcher = require('@parcel/watcher');
+		watcher.subscribe(config.srcDir, () => tryBuild(resolvedOptions, didBuild));
+	} else {
+		return build(resolvedOptions, didBuild).catch(() => process.exit(1));
+	}
+};

extensions/ipynb/esbuild.js

@@ -5,47 +5,14 @@
 //@ts-check
 
 const path = require('path');
-const fse = require('fs-extra');
-const esbuild = require('esbuild');
-
-const args = process.argv.slice(2);
-
-const isWatch = args.indexOf('--watch') >= 0;
-
-let outputRoot = __dirname;
-const outputRootIndex = args.indexOf('--outputRoot');
-if (outputRootIndex >= 0) {
-	outputRoot = args[outputRootIndex + 1];
-}
 
 const srcDir = path.join(__dirname, 'notebook-src');
-const outDir = path.join(outputRoot, 'notebook-out');
+const outDir = path.join(__dirname, 'notebook-out');
 
-async function build() {
+require('../esbuild-webview-common').run({
-	await esbuild.build({
+	entryPoints: [
-		entryPoints: [
+		path.join(srcDir, 'cellAttachmentRenderer.ts'),
-			path.join(srcDir, 'cellAttachmentRenderer.ts'),
+	],
-		],
+	srcDir,
-		bundle: true,
+	outdir: outDir,
-		minify: false,
+}, process.argv);
-		sourcemap: false,
-		format: 'esm',
-		outdir: outDir,
-		platform: 'browser',
-		target: ['es2020'],
-	});
-}
-
-
-build().catch(() => process.exit(1));
-
-if (isWatch) {
-	const watcher = require('@parcel/watcher');
-	watcher.subscribe(srcDir, async () => {
-		try {
-			await build();
-		} catch (e) {
-			console.error(e);
-		}
-	});
-}

extensions/markdown-language-features/esbuild-notebook.js

@@ -4,42 +4,14 @@
  *--------------------------------------------------------------------------------------------*/
 // @ts-check
 const path = require('path');
-const esbuild = require('esbuild');
-
-const args = process.argv.slice(2);
-
-const isWatch = args.indexOf('--watch') >= 0;
-
-let outputRoot = __dirname;
-const outputRootIndex = args.indexOf('--outputRoot');
-if (outputRootIndex >= 0) {
-	outputRoot = args[outputRootIndex + 1];
-}
 
 const srcDir = path.join(__dirname, 'notebook');
-const outDir = path.join(outputRoot, 'notebook-out');
+const outDir = path.join(__dirname, 'notebook-out');
 
-function build() {
+require('../esbuild-webview-common').run({
-	return esbuild.build({
+	entryPoints: [
-		entryPoints: [
+		path.join(srcDir, 'index.ts'),
-			path.join(__dirname, 'notebook', 'index.ts'),
+	],
-		],
+	srcDir,
-		bundle: true,
+	outdir: outDir,
-		minify: true,
+}, process.argv);
-		sourcemap: false,
-		format: 'esm',
-		outdir: outDir,
-		platform: 'browser',
-		target: ['es2020'],
-	});
-}
-
-
-build().catch(() => process.exit(1));
-
-if (isWatch) {
-	const watcher = require('@parcel/watcher');
-	watcher.subscribe(srcDir, () => {
-		return build();
-	});
-}

extensions/markdown-language-features/esbuild-preview.js

@@ -4,42 +4,15 @@
  *--------------------------------------------------------------------------------------------*/
 // @ts-check
 const path = require('path');
-const esbuild = require('esbuild');
-
-const args = process.argv.slice(2);
-
-const isWatch = args.indexOf('--watch') >= 0;
-
-let outputRoot = __dirname;
-const outputRootIndex = args.indexOf('--outputRoot');
-if (outputRootIndex >= 0) {
-	outputRoot = args[outputRootIndex + 1];
-}
 
 const srcDir = path.join(__dirname, 'preview-src');
-const outDir = path.join(outputRoot, 'media');
+const outDir = path.join(__dirname, 'media');
 
-function build() {
+require('../esbuild-webview-common').run({
-	return esbuild.build({
+	entryPoints: [
-		entryPoints: [
+		path.join(srcDir, 'index.ts'),
-			path.join(srcDir, 'index.ts'),
+		path.join(srcDir, 'pre'),
-			path.join(srcDir, 'pre'),
+	],
-		],
+	srcDir,
-		bundle: true,
+	outdir: outDir,
-		minify: true,
+}, process.argv);
-		sourcemap: false,
-		format: 'iife',
-		outdir: outDir,
-		platform: 'browser',
-		target: ['es2020'],
-	});
-}
-
-build().catch(() => process.exit(1));
-
-if (isWatch) {
-	const watcher = require('@parcel/watcher');
-	watcher.subscribe(srcDir, () => {
-		return build();
-	});
-}

extensions/markdown-math/esbuild.js

@@ -6,35 +6,13 @@
 
 const path = require('path');
 const fse = require('fs-extra');
-const esbuild = require('esbuild');
 
 const args = process.argv.slice(2);
 
-const isWatch = args.indexOf('--watch') >= 0;
-
-let outputRoot = __dirname;
-const outputRootIndex = args.indexOf('--outputRoot');
-if (outputRootIndex >= 0) {
-	outputRoot = args[outputRootIndex + 1];
-}
-
 const srcDir = path.join(__dirname, 'notebook');
-const outDir = path.join(outputRoot, 'notebook-out');
+const outDir = path.join(__dirname, 'notebook-out');
-
-async function build() {
-	await esbuild.build({
-		entryPoints: [
-			path.join(srcDir, 'katex.ts'),
-		],
-		bundle: true,
-		minify: true,
-		sourcemap: false,
-		format: 'esm',
-		outdir: outDir,
-		platform: 'browser',
-		target: ['es2020'],
-	});
 
+function postBuild(outDir) {
 	fse.copySync(
 		path.join(__dirname, 'node_modules', 'katex', 'dist', 'katex.min.css'),
 		path.join(outDir, 'katex.min.css'));
@@ -51,16 +29,10 @@ async function build() {
 	}
 }
 
-
+require('../esbuild-webview-common').run({
-build().catch(() => process.exit(1));
+	entryPoints: [
-
+		path.join(srcDir, 'katex.ts'),
-if (isWatch) {
+	],
-	const watcher = require('@parcel/watcher');
+	srcDir,
-	watcher.subscribe(srcDir, async () => {
+	outdir: outDir,
-		try {
+}, process.argv, postBuild);
-			await build();
-		} catch (e) {
-			console.error(e);
-		}
-	});
-}

extensions/notebook-renderers/esbuild.js

@@ -4,41 +4,14 @@
  *--------------------------------------------------------------------------------------------*/
 // @ts-check
 const path = require('path');
-const esbuild = require('esbuild');
-
-const args = process.argv.slice(2);
-
-const isWatch = args.indexOf('--watch') >= 0;
-
-let outputRoot = __dirname;
-const outputRootIndex = args.indexOf('--outputRoot');
-if (outputRootIndex >= 0) {
-	outputRoot = args[outputRootIndex + 1];
-}
 
 const srcDir = path.join(__dirname, 'src');
-const outDir = path.join(outputRoot, 'renderer-out');
+const outDir = path.join(__dirname, 'renderer-out');
 
-function build() {
+require('../esbuild-webview-common').run({
-	return esbuild.build({
+	entryPoints: [
-		entryPoints: [
+		path.join(srcDir, 'index.ts'),
-			path.join(srcDir, 'index.ts'),
+	],
-		],
+	srcDir,
-		bundle: true,
+	outdir: outDir,
-		minify: false,
+}, process.argv);
-		sourcemap: false,
-		format: 'esm',
-		outdir: outDir,
-		platform: 'browser',
-		target: ['es2020'],
-	});
-}
-
-build().catch(() => process.exit(1));
-
-if (isWatch) {
-	const watcher = require('@parcel/watcher');
-	watcher.subscribe(srcDir, () => {
-		return build();
-	});
-}

extensions/simple-browser/esbuild-preview.js

@@ -4,45 +4,20 @@
  *--------------------------------------------------------------------------------------------*/
 // @ts-check
 const path = require('path');
-const esbuild = require('esbuild');
-
-const args = process.argv.slice(2);
-
-const isWatch = args.indexOf('--watch') >= 0;
-
-let outputRoot = __dirname;
-const outputRootIndex = args.indexOf('--outputRoot');
-if (outputRootIndex >= 0) {
-	outputRoot = args[outputRootIndex + 1];
-}
 
 const srcDir = path.join(__dirname, 'preview-src');
-const outDir = path.join(outputRoot, 'media');
+const outDir = path.join(__dirname, 'media');
 
-async function build() {
+require('../esbuild-webview-common').run({
-	await esbuild.build({
+	entryPoints: {
-		entryPoints: {
+		'index': path.join(srcDir, 'index.ts'),
-			'index': path.join(srcDir, 'index.ts'),
+		'codicon': path.join(__dirname, 'node_modules', 'vscode-codicons', 'dist', 'codicon.css'),
-			'codicon': path.join(__dirname, 'node_modules', 'vscode-codicons', 'dist', 'codicon.css'),
+	},
-		},
+	srcDir,
+	outdir: outDir,
+	additionalOptions: {
 		loader: {
 			'.ttf': 'dataurl',
-		},
+		}
-		bundle: true,
+	}
-		minify: true,
+}, process.argv);
-		sourcemap: false,
-		format: 'esm',
-		outdir: outDir,
-		platform: 'browser',
-		target: ['es2020'],
-	});
-}
-
-build().catch(() => process.exit(1));
-
-if (isWatch) {
-	const watcher = require('@parcel/watcher');
-	watcher.subscribe(srcDir, () => {
-		return build();
-	});
-}