Clean up esbuilding of extensions

- Make sure we still always type check using `tsgo --noEmit`
- Align names of esbuild files
- Convert all esbuild files to typescript. We use the `.mts` extension to avoid annoying node warnings about using pacakges

build/lib/extensions.ts

@@ -25,6 +25,7 @@ import { getProductionDependencies } from './dependencies.ts';
 import { type IExtensionDefinition, getExtensionStream } from './builtInExtensions.ts';
 import { getVersion } from './getVersion.ts';
 import { fetchUrls, fetchGithub } from './fetch.ts';
+import { createTsgoStream } from './tsgo.ts';
 import vzip from 'gulp-vinyl-zip';
 
 import { createRequire } from 'module';
@@ -67,23 +68,27 @@ function updateExtensionPackageJSON(input: Stream, update: (data: any) => any):
 function fromLocal(extensionPath: string, forWeb: boolean, disableMangle: boolean): Stream {
 
 	const esbuildConfigFileName = forWeb
-		? 'esbuild-browser.ts'
-		: 'esbuild.ts';
+		? 'esbuild.browser.mts'
+		: 'esbuild.mts';
 
 	const webpackConfigFileName = forWeb
 		? `extension-browser.webpack.config.js`
 		: `extension.webpack.config.js`;
 
 	const hasEsbuild = fs.existsSync(path.join(extensionPath, esbuildConfigFileName));
-	const isWebPacked = fs.existsSync(path.join(extensionPath, webpackConfigFileName));
+	const hasWebpack = fs.existsSync(path.join(extensionPath, webpackConfigFileName));
 
 	let input: Stream;
 	let isBundled = false;
 
 	if (hasEsbuild) {
-		input = fromLocalEsbuild(extensionPath, esbuildConfigFileName);
+		// Unlike webpack, esbuild only does bundling so we still want to run a separate type check step
+		input = es.merge(
+			fromLocalEsbuild(extensionPath, esbuildConfigFileName),
+			typeCheckExtension(extensionPath, forWeb),
+		);
 		isBundled = true;
-	} else if (isWebPacked) {
+	} else if (hasWebpack) {
 		input = fromLocalWebpack(extensionPath, webpackConfigFileName, disableMangle);
 		isBundled = true;
 	} else {
@@ -105,6 +110,11 @@ function fromLocal(extensionPath: string, forWeb: boolean, disableMangle: boolea
 	return input;
 }
 
+function typeCheckExtension(extensionPath: string, forWeb: boolean): Stream {
+	const tsconfigFileName = forWeb ? 'tsconfig.browser.json' : 'tsconfig.json';
+	const tsconfigPath = path.join(extensionPath, tsconfigFileName);
+	return createTsgoStream(tsconfigPath, { reporterId: 'extensions', noEmit: true });
+}
 
 function fromLocalWebpack(extensionPath: string, webpackConfigFileName: string, disableMangle: boolean): Stream {
 	const vsce = require('@vscode/vsce') as typeof import('@vscode/vsce');
@@ -267,6 +277,7 @@ function fromLocalEsbuild(extensionPath: string, esbuildConfigFileName: string):
 			if (error) {
 				return reject(error);
 			}
+
 			const matches = (stderr || '').match(/\> (.+): error: (.+)?/g);
 			fancyLog(`Bundled extension: ${ansiColors.yellow(path.join(path.basename(extensionPath), esbuildConfigFileName))} with ${matches ? matches.length : 0} errors.`);
 			for (const match of matches || []) {
@@ -632,17 +643,6 @@ export function translatePackageJSON(packageJSON: string, packageNLSPath: string
 
 const extensionsPath = path.join(root, 'extensions');
 
-// Additional projects to run esbuild on. These typically build code for webviews
-const esbuildMediaScripts = [
-	'ipynb/esbuild.mjs',
-	'markdown-language-features/esbuild-notebook.mjs',
-	'markdown-language-features/esbuild-preview.mjs',
-	'markdown-math/esbuild.mjs',
-	'mermaid-chat-features/esbuild-chat-webview.mjs',
-	'notebook-renderers/esbuild.mjs',
-	'simple-browser/esbuild-preview.mjs',
-];
-
 export async function webpackExtensions(taskName: string, isWatch: boolean, webpackConfigLocations: { configPath: string; outputRoot?: string }[]) {
 	const webpack = require('webpack') as typeof import('webpack');
 
@@ -742,6 +742,18 @@ export async function esbuildExtensions(taskName: string, isWatch: boolean, scri
 	await Promise.all(tasks);
 }
 
+
+// Additional projects to run esbuild on. These typically build code for webviews
+const esbuildMediaScripts = [
+	'ipynb/esbuild.notebook.mts',
+	'markdown-language-features/esbuild.notebook.mts',
+	'markdown-language-features/esbuild.webview.mts',
+	'markdown-math/esbuild.notebook.mts',
+	'mermaid-chat-features/esbuild.webview.mts',
+	'notebook-renderers/esbuild.notebook.mts',
+	'simple-browser/esbuild.webview.mts',
+];
+
 export function buildExtensionMedia(isWatch: boolean, outputRoot?: string): Promise<void> {
 	return esbuildExtensions('esbuilding extension media', isWatch, esbuildMediaScripts.map(p => ({
 		script: path.join(extensionsPath, p),

build/lib/tsgo.ts

@@ -12,7 +12,7 @@ const root = path.dirname(path.dirname(import.meta.dirname));
 const npx = process.platform === 'win32' ? 'npx.cmd' : 'npx';
 const ansiRegex = /[\u001b\u009b][[()#;?]*(?:[0-9]{1,4}(?:;[0-9]{0,4})*)?[0-9A-ORZcf-nqry=><]/g;
 
-export function spawnTsgo(projectPath: string, config: { reporterId: string }, onComplete?: () => Promise<void> | void): Promise<void> {
+export function spawnTsgo(projectPath: string, config: { reporterId: string; noEmit?: boolean }, onComplete?: () => Promise<void> | void): Promise<void> {
 	const reporter = createReporter(config.reporterId);
 	let report: NodeJS.ReadWriteStream | undefined;
 
@@ -33,7 +33,12 @@ export function spawnTsgo(projectPath: string, config: { reporterId: string }, o
 
 	beginReport(false);
 
-	const args = ['tsgo', '--project', projectPath, '--pretty', 'false', '--sourceMap', '--inlineSources'];
+	const args = ['tsgo', '--project', projectPath, '--pretty', 'false'];
+	if (config.noEmit) {
+		args.push('--noEmit');
+	} else {
+		args.push('--sourceMap', '--inlineSources');
+	}
 	const child = cp.spawn(npx, args, {
 		cwd: root,
 		stdio: ['ignore', 'pipe', 'pipe'],
@@ -99,7 +104,7 @@ export function spawnTsgo(projectPath: string, config: { reporterId: string }, o
 	});
 }
 
-export function createTsgoStream(projectPath: string, config: { reporterId: string }, onComplete?: () => Promise<void> | void): NodeJS.ReadWriteStream {
+export function createTsgoStream(projectPath: string, config: { reporterId: string; noEmit?: boolean }, onComplete?: () => Promise<void> | void): NodeJS.ReadWriteStream {
 	const stream = es.through();
 
 	spawnTsgo(projectPath, config, onComplete).then(() => {

extensions/esbuild-webview-common.mts

@@ -2,27 +2,22 @@
  *  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.
+ * Common build script for extension scripts used in in webviews.
  */
 import path from 'node:path';
 import esbuild from 'esbuild';
 
-/**
- * @typedef {Partial<import('esbuild').BuildOptions> & {
- * 	entryPoints: string[] | Record<string, string> | { in: string, out: string }[];
- * 	outdir: string;
- * }} BuildOptions
- */
+export type BuildOptions = Partial<esbuild.BuildOptions> & {
+	entryPoints: string[] | Record<string, string> | { in: string; out: string }[];
+	outdir: string;
+};
 
 /**
  * Build the source code once using esbuild.
- *
- * @param {BuildOptions} options
- * @param {(outDir: string) => unknown} [didBuild]
  */
-async function build(options, didBuild) {
+async function build(options: BuildOptions, didBuild?: (outDir: string) => unknown): Promise<void> {
 	await esbuild.build({
 		bundle: true,
 		minify: true,
@@ -38,11 +33,8 @@ async function build(options, didBuild) {
 
 /**
  * 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) {
+async function tryBuild(options: BuildOptions, didBuild?: (outDir: string) => unknown): Promise<void> {
 	try {
 		await build(options, didBuild);
 	} catch (err) {
@@ -50,17 +42,16 @@ async function tryBuild(options, didBuild) {
 	}
 }
 
-/**
- * @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]
- */
-export async function run(config, args, didBuild) {
+export async function run(
+	config: {
+		srcDir: string;
+		outdir: string;
+		entryPoints: BuildOptions['entryPoints'];
+		additionalOptions?: Partial<esbuild.BuildOptions>;
+	},
+	args: string[],
+	didBuild?: (outDir: string) => unknown
+): Promise<void> {
 	let outdir = config.outdir;
 	const outputRootIndex = args.indexOf('--outputRoot');
 	if (outputRootIndex >= 0) {
@@ -69,8 +60,7 @@ export async function run(config, args, didBuild) {
 		outdir = path.join(outputRoot, outputDirName);
 	}
 
-	/** @type {BuildOptions} */
-	const resolvedOptions = {
+	const resolvedOptions: BuildOptions = {
 		entryPoints: config.entryPoints,
 		outdir,
 		logOverride: {

extensions/ipynb/esbuild.notebook.mts

@@ -2,9 +2,8 @@
  *  Copyright (c) Microsoft Corporation. All rights reserved.
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
-// @ts-check
 import path from 'node:path';
-import { run } from '../esbuild-webview-common.mjs';
+import { run } from '../esbuild-webview-common.mts';
 
 const srcDir = path.join(import.meta.dirname, 'notebook-src');
 const outDir = path.join(import.meta.dirname, 'notebook-out');

extensions/ipynb/package.json

@@ -158,7 +158,7 @@
   "scripts": {
     "compile": "npx gulp compile-extension:ipynb && npm run build-notebook",
     "watch": "npx gulp watch-extension:ipynb",
-    "build-notebook": "node ./esbuild.mjs"
+    "build-notebook": "node ./esbuild.notebook.mts"
   },
   "dependencies": {
     "@enonic/fnv-plus": "^1.3.0",

extensions/markdown-language-features/esbuild.browser.mts

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import * as fs from 'node:fs';
 import * as path from 'node:path';
-import { run } from '../esbuild-extension-common.ts';
+import { run } from '../esbuild-extension-common.mts';
 
 const srcDir = path.join(import.meta.dirname, 'src');
 const outDir = path.join(import.meta.dirname, 'dist', 'browser');

extensions/markdown-language-features/esbuild.mts

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import * as fs from 'node:fs';
 import * as path from 'node:path';
-import { run } from '../esbuild-extension-common.ts';
+import { run } from '../esbuild-extension-common.mts';
 
 const srcDir = path.join(import.meta.dirname, 'src');
 const outDir = path.join(import.meta.dirname, 'dist');

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

@@ -2,9 +2,8 @@
  *  Copyright (c) Microsoft Corporation. All rights reserved.
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
-// @ts-check
 import path from 'path';
-import { run } from '../esbuild-webview-common.mjs';
+import { run } from '../esbuild-webview-common.mts';
 
 const srcDir = path.join(import.meta.dirname, 'notebook');
 const outDir = path.join(import.meta.dirname, 'notebook-out');

extensions/markdown-language-features/esbuild.webview.mts

@@ -2,9 +2,8 @@
  *  Copyright (c) Microsoft Corporation. All rights reserved.
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
-// @ts-check
 import path from 'path';
-import { run } from '../esbuild-webview-common.mjs';
+import { run } from '../esbuild-webview-common.mts';
 
 const srcDir = path.join(import.meta.dirname, 'preview-src');
 const outDir = path.join(import.meta.dirname, 'media');

extensions/markdown-language-features/package.json

@@ -757,14 +757,20 @@
     ]
   },
   "scripts": {
-    "compile": "gulp compile-extension:markdown-language-features-languageService && gulp compile-extension:markdown-language-features && npm run build-preview && npm run build-notebook",
-    "watch": "npm run build-preview && gulp watch-extension:markdown-language-features watch-extension:markdown-language-features-languageService",
-    "vscode:prepublish": "npm run build-ext && npm run build-preview",
-    "build-ext": "node ../../node_modules/gulp/bin/gulp.js --gulpfile ../../build/gulpfile.extensions.mjs compile-extension:markdown-language-features ./tsconfig.json",
-    "build-notebook": "node ./esbuild-notebook.mjs",
-    "build-preview": "node ./esbuild-preview.mjs",
-    "compile-web": "npx webpack-cli --config extension-browser.webpack.config --mode none",
-    "watch-web": "npx webpack-cli --config extension-browser.webpack.config --mode none --watch"
+    "compile": "npm-run-all2 -lp build-ext build-webview build-notebook",
+    "watch": "npm-run-all2 -lp watch-ext watch-webview watch-notebook",
+    "build-ext": "gulp compile-extension:markdown-language-features",
+    "watch-ext": "gulp watch-extension:markdown-language-features",
+    "build-notebook": "node ./esbuild.notebook.mts",
+    "watch-notebook": "node ./esbuild.notebook.mts --watch",
+    "build-webview": "node ./esbuild.webview.mts",
+    "watch-webview": "node ./esbuild.webview.mts --watch",
+    "compile-web": "npm-run-all2 -lp bundle-web typecheck-web",
+    "bundle-web": "node ./esbuild.browser.mts",
+    "typecheck-web": "tsgo --project ./tsconfig.browser.json --noEmit",
+    "watch-web": "npm-run-all2 -lp watch-bundle-web watch-typecheck-web",
+    "watch-bundle-web": "node ./esbuild.browser.mts --watch",
+    "watch-typecheck-web": "tsgo --project ./tsconfig.browser.json --noEmit --watch"
   },
   "dependencies": {
     "@vscode/extension-telemetry": "^0.9.8",

extensions/markdown-language-features/tsconfig.browser.json

@@ -3,5 +3,8 @@
 	"compilerOptions": {},
 	"exclude": [
 		"./src/test/**"
+	],
+	"files": [
+		"./src/extension.browser.ts"
 	]
 }

extensions/markdown-math/esbuild.browser.mts

@@ -3,7 +3,7 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 import * as path from 'node:path';
-import { run } from '../esbuild-extension-common.ts';
+import { run } from '../esbuild-extension-common.mts';
 
 const srcDir = path.join(import.meta.dirname, 'src');
 const outDir = path.join(import.meta.dirname, 'dist', 'browser');

extensions/markdown-math/esbuild.mts

@@ -3,7 +3,7 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 import * as path from 'node:path';
-import { run } from '../esbuild-extension-common.ts';
+import { run } from '../esbuild-extension-common.mts';
 
 const srcDir = path.join(import.meta.dirname, 'src');
 const outDir = path.join(import.meta.dirname, 'dist');

extensions/markdown-math/esbuild.notebook.mts

@@ -2,18 +2,14 @@
  *  Copyright (c) Microsoft Corporation. All rights reserved.
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
-//@ts-check
-
-import path from 'path';
 import fse from 'fs-extra';
-import { run } from '../esbuild-webview-common.mjs';
-
-const args = process.argv.slice(2);
+import path from 'path';
+import { run } from '../esbuild-webview-common.mts';
 
 const srcDir = path.join(import.meta.dirname, 'notebook');
 const outDir = path.join(import.meta.dirname, 'notebook-out');
 
-function postBuild(outDir) {
+function postBuild(outDir: string) {
 	fse.copySync(
 		path.join(import.meta.dirname, 'node_modules', 'katex', 'dist', 'katex.min.css'),
 		path.join(outDir, 'katex.min.css'));

extensions/markdown-math/package.json

@@ -108,7 +108,7 @@
   "scripts": {
     "compile": "npm run build-notebook",
     "watch": "npm run build-notebook",
-    "build-notebook": "node ./esbuild.mjs"
+    "build-notebook": "node ./esbuild.mts"
   },
   "devDependencies": {
     "@types/markdown-it": "^0.0.0",

extensions/markdown-math/tsconfig.browser.json

@@ -0,0 +1,9 @@
+{
+	"extends": "../tsconfig.json",
+	"compilerOptions": {
+		"types": [],
+		"typeRoots": [
+			"./node_modules/@types"
+		]
+	}
+}

extensions/media-preview/esbuild.browser.mts

@@ -3,7 +3,7 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 import * as path from 'node:path';
-import { run } from '../esbuild-extension-common.ts';
+import { run } from '../esbuild-extension-common.mts';
 
 const srcDir = path.join(import.meta.dirname, 'src');
 const outDir = path.join(import.meta.dirname, 'dist', 'browser');

extensions/media-preview/esbuild.mts

@@ -3,7 +3,7 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 import * as path from 'node:path';
-import { run } from '../esbuild-extension-common.ts';
+import { run } from '../esbuild-extension-common.mts';
 
 const srcDir = path.join(import.meta.dirname, 'src');
 const outDir = path.join(import.meta.dirname, 'dist');

extensions/mermaid-chat-features/esbuild.browser.mts

@@ -3,7 +3,7 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 import * as path from 'node:path';
-import { run } from '../esbuild-extension-common.ts';
+import { run } from '../esbuild-extension-common.mts';
 
 const srcDir = path.join(import.meta.dirname, 'src');
 const outDir = path.join(import.meta.dirname, 'dist', 'browser');

extensions/mermaid-chat-features/esbuild.mts

@@ -3,7 +3,7 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 import * as path from 'node:path';
-import { run } from '../esbuild-extension-common.ts';
+import { run } from '../esbuild-extension-common.mts';
 
 const srcDir = path.join(import.meta.dirname, 'src');
 const outDir = path.join(import.meta.dirname, 'dist');

extensions/mermaid-chat-features/esbuild.webview.mts

@@ -2,9 +2,8 @@
  *  Copyright (c) Microsoft Corporation. All rights reserved.
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
-// @ts-check
 import path from 'path';
-import { run } from '../esbuild-webview-common.mjs';
+import { run } from '../esbuild-webview-common.mts';
 
 const srcDir = path.join(import.meta.dirname, 'chat-webview-src');
 const outDir = path.join(import.meta.dirname, 'chat-webview-out');

extensions/mermaid-chat-features/package.json

@@ -117,7 +117,7 @@
     "watch": "npm run build-chat-webview && gulp watch-extension:mermaid-chat-features",
     "vscode:prepublish": "npm run build-ext && npm run build-chat-webview",
     "build-ext": "node ../../node_modules/gulp/bin/gulp.js --gulpfile ../../build/gulpfile.extensions.mjs compile-extension:mermaid-chat-features",
-    "build-chat-webview": "node ./esbuild-chat-webview.mjs",
+    "build-chat-webview": "node ./esbuild.webview.mts",
     "compile-web": "npx webpack-cli --config extension-browser.webpack.config --mode none",
     "watch-web": "npx webpack-cli --config extension-browser.webpack.config --mode none --watch --info-verbosity verbose"
   },

extensions/notebook-renderers/esbuild.notebook.mts

@@ -2,9 +2,8 @@
  *  Copyright (c) Microsoft Corporation. All rights reserved.
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
-// @ts-check
 import path from 'path';
-import { run } from '../esbuild-webview-common.mjs';
+import { run } from '../esbuild-webview-common.mts';
 
 const srcDir = path.join(import.meta.dirname, 'src');
 const outDir = path.join(import.meta.dirname, 'renderer-out');

extensions/notebook-renderers/package.json

@@ -44,7 +44,7 @@
 	"scripts": {
 		"compile": "npx gulp compile-extension:notebook-renderers && npm run build-notebook",
 		"watch": "npx gulp compile-watch:notebook-renderers",
-		"build-notebook": "node ./esbuild.mjs"
+		"build-notebook": "node ./esbuild.notebook.mts"
 	},
 	"devDependencies": {
 		"@types/jsdom": "^21.1.0",

extensions/simple-browser/esbuild.webview.mts

@@ -2,9 +2,8 @@
  *  Copyright (c) Microsoft Corporation. All rights reserved.
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
-// @ts-check
 import path from 'path';
-import { run } from '../esbuild-webview-common.mjs';
+import { run } from '../esbuild-webview-common.mts';
 
 const srcDir = path.join(import.meta.dirname, 'preview-src');
 const outDir = path.join(import.meta.dirname, 'media');

extensions/simple-browser/package.json

@@ -71,7 +71,7 @@
     "watch": "npm run build-preview && gulp watch-extension:simple-browser",
     "vscode:prepublish": "npm run build-ext && npm run build-preview",
     "build-ext": "node ../../node_modules/gulp/bin/gulp.js --gulpfile ../../build/gulpfile.extensions.mjs compile-extension:simple-browser ./tsconfig.json",
-    "build-preview": "node ./esbuild-preview.mjs",
+    "build-preview": "node ./esbuild-preview.mts",
     "compile-web": "npx webpack-cli --config extension-browser.webpack.config --mode none",
     "watch-web": "npx webpack-cli --config extension-browser.webpack.config --mode none --watch --info-verbosity verbose"
   },