esbuild for web bundle (#14584)

* Update TypeScript configuration for faster
compilation

* Update tsconfig for faster compilation using
jsonc-parser

* Update tsconfig for faster compilation by skipping
lib check

* Skip web bundle compilation if cache hit

* Optimize TypeScript compilation for faster builds
and fix cache condition in build-test.yml

* esbuild for web bundle

.github/workflows/build-test.yml

@@ -621,6 +621,7 @@ jobs:
         env:
           VSC_JUPYTER_CI_TEST_GREP: ${{ matrix.tags }}
           VSC_JUPYTER_CI_SKIP_WEB_BUNDLE: 1
+          VSC_JUPYTER_CI_FAST_COMPILATION: 1
 
       # Used by tests for non-python kernels.
       # Test are enabled via env variable `VSC_JUPYTER_CI_RUN_NON_PYTHON_NB_TEST`

build/esbuild/build.ts

@@ -112,7 +112,7 @@ function createConfig(
         entryPoints: [source],
         outfile,
         bundle: true,
-        external: ['log4js', 'vscode', 'commonjs'], // From webacpk scripts we had.
+        external: ['log4js', 'vscode', 'commonjs', 'node:crypto'].concat(target === 'web' ? ['os'] : []), // From webacpk scripts we had.
         format: 'esm',
         define:
             target === 'desktop'
@@ -211,6 +211,11 @@ async function buildAll() {
                   path.join(extensionFolder, 'out', 'webviews', 'webview-side', 'widgetTester', 'widgetTester.js')
               )
             : Promise.resolve(),
+        ,
+        build(
+            path.join(extensionFolder, 'src', 'extension.web.ts'),
+            path.join(extensionFolder, 'out', 'extension.web.js')
+        ),
         ...nodeModulesToExternalize.map(async (module) => {
             let fullPath = path.join(extensionFolder, 'node_modules', `${module}.js`);
             if (!fs.existsSync(fullPath)) {

gulpfile.js

@@ -182,17 +182,6 @@ gulp.task('installPythonLibs', async () => {
     }
 });
 
-gulp.task('compile-webextension', async () => {
-    if (isCI && process.env.VSC_JUPYTER_CI_SKIP_WEB_BUNDLE === '1') {
-        return;
-    }
-    // No need to build dependencies for desktop.
-    if (common.getBundleConfiguration() === common.bundleConfiguration.desktop) {
-        return;
-    }
-    await buildWebPackForDevOrProduction('./build/webpack/webpack.extension.web.config.js');
-});
-
 async function buildWebPackForDevOrProduction(configFile, configNameForProductionBuilds) {
     if (configNameForProductionBuilds) {
         await buildWebPack(configNameForProductionBuilds, ['--config', configFile], webpackEnv);
@@ -429,7 +418,7 @@ gulp.task(
 );
 gulp.task('checkDependencies', gulp.series('checkNativeDependencies', 'checkNpmDependencies'));
 
-gulp.task('prePublishNonBundle', gulp.parallel('compile', 'compile-webviews-dev', 'compile-webextension'));
+gulp.task('prePublishNonBundle', gulp.parallel('compile', 'compile-webviews-dev'));
 
 function spawnAsync(command, args, env, rejectOnStdErr = false) {
     env = env || {};

package.json

@@ -2077,10 +2077,9 @@
         "compile-no-watch": "tsc -p ./",
         "compiled": "deemon npm run compile",
         "kill-compiled": "deemon --kill npm run compile",
-        "compile-web": "webpack --mode development --config ./build/webpack/webpack.extension.web.config.js",
-        "compile-web-watch": "webpack --mode development --config ./build/webpack/webpack.extension.web.config.js --stats-error-details --watch --progress",
-        "compile-web-test": "cross-env VSC_TEST_BUNDLE=true npm run compile-web",
-        "compile-web-test-watch": "cross-env VSC_TEST_BUNDLE=true npm run compile-web-watch",
+        "compile-web": "npm run compile-viewers",
+        "compile-web-test": "cross-env VSC_TEST_BUNDLE=true webpack --mode development --config ./build/webpack/webpack.extension.web.config.js",
+        "compile-web-test-watch": "cross-env VSC_TEST_BUNDLE=true webpack --mode development --config ./build/webpack/webpack.extension.web.config.js --stats-error-details --watch --progress",
         "compile-viewers": "npx tsx build/esbuild/build.ts",
         "compile-viewers-release": "npx tsx build/esbuild/build.ts --production",
         "compile-viewers-watch": "npx tsx build/esbuild/build.ts --watch",