Use esbuild instead of webpack to bundle the css extension

Switches from webpack to esbuild to bundle the css extension. Tested this locally in a browser and creating an official build to test the bundled extension still work correctly
This commit is contained in:
Matt Bierner
2026-02-12 23:51:53 -08:00
parent 16e49a8b88
commit 39ebcc7f34
11 changed files with 105 additions and 82 deletions

View File

@@ -6,16 +6,12 @@ client/src/**
server/src/**
client/out/**
server/out/**
client/tsconfig.json
server/tsconfig.json
**/tsconfig*.json
server/test/**
server/bin/**
server/build/**
server/package-lock.json
server/.npmignore
package-lock.json
server/extension.webpack.config.js
extension.webpack.config.js
server/extension-browser.webpack.config.js
extension-browser.webpack.config.js
**/esbuild*.mts
CONTRIBUTING.md

View File

@@ -0,0 +1,7 @@
{
"extends": "./tsconfig.json",
"exclude": [
"./src/node/**",
"./src/test/**"
]
}

View File

@@ -0,0 +1,36 @@
/*---------------------------------------------------------------------------------------------
* Copyright (c) Microsoft Corporation. All rights reserved.
* 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.mts';
const extensionRoot = import.meta.dirname;
await Promise.all([
// Build client
run({
platform: 'browser',
entryPoints: {
'cssClientMain': path.join(extensionRoot, 'client', 'src', 'browser', 'cssClientMain.ts'),
},
srcDir: path.join(extensionRoot, 'client', 'src'),
outdir: path.join(extensionRoot, 'client', 'dist', 'browser'),
additionalOptions: {
tsconfig: path.join(extensionRoot, 'client', 'tsconfig.browser.json'),
},
}, process.argv),
// Build server
run({
platform: 'browser',
entryPoints: {
'cssServerMain': path.join(extensionRoot, 'server', 'src', 'browser', 'cssServerWorkerMain.ts'),
},
srcDir: path.join(extensionRoot, 'server', 'src'),
outdir: path.join(extensionRoot, 'server', 'dist', 'browser'),
additionalOptions: {
tsconfig: path.join(extensionRoot, 'server', 'tsconfig.browser.json'),
},
}, process.argv),
]);

View File

@@ -0,0 +1,36 @@
/*---------------------------------------------------------------------------------------------
* Copyright (c) Microsoft Corporation. All rights reserved.
* 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.mts';
const extensionRoot = import.meta.dirname;
await Promise.all([
// Build client
run({
platform: 'node',
entryPoints: {
'cssClientMain': path.join(extensionRoot, 'client', 'src', 'node', 'cssClientMain.ts'),
},
srcDir: path.join(extensionRoot, 'client', 'src'),
outdir: path.join(extensionRoot, 'client', 'dist', 'node'),
additionalOptions: {
tsconfig: path.join(extensionRoot, 'client', 'tsconfig.json'),
},
}, process.argv),
// Build server
run({
platform: 'node',
entryPoints: {
'cssServerMain': path.join(extensionRoot, 'server', 'src', 'node', 'cssServerNodeMain.ts'),
},
srcDir: path.join(extensionRoot, 'server', 'src'),
outdir: path.join(extensionRoot, 'server', 'dist', 'node'),
additionalOptions: {
tsconfig: path.join(extensionRoot, 'server', 'tsconfig.json'),
},
}, process.argv),
]);

View File

@@ -1,18 +0,0 @@
/*---------------------------------------------------------------------------------------------
* 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 { browser as withBrowserDefaults } from '../shared.webpack.config.mjs';
import path from 'path';
export default withBrowserDefaults({
context: path.join(import.meta.dirname, 'client'),
entry: {
extension: './src/browser/cssClientMain.ts'
},
output: {
filename: 'cssClientMain.js',
path: path.join(import.meta.dirname, 'client', 'dist', 'browser')
}
});

View File

@@ -1,18 +0,0 @@
/*---------------------------------------------------------------------------------------------
* 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 withDefaults from '../shared.webpack.config.mjs';
import path from 'path';
export default withDefaults({
context: path.join(import.meta.dirname, 'client'),
entry: {
extension: './src/node/cssClientMain.ts',
},
output: {
filename: 'cssClientMain.js',
path: path.join(import.meta.dirname, 'client', 'dist', 'node')
}
});

View File

@@ -1,20 +0,0 @@
/*---------------------------------------------------------------------------------------------
* 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 { browser as withBrowserDefaults } from '../../shared.webpack.config.mjs';
import path from 'path';
export default withBrowserDefaults({
context: import.meta.dirname,
entry: {
extension: './src/browser/cssServerWorkerMain.ts',
},
output: {
filename: 'cssServerMain.js',
path: path.join(import.meta.dirname, 'dist', 'browser'),
libraryTarget: 'var',
library: 'serverExportVar'
}
});

View File

@@ -1,18 +0,0 @@
/*---------------------------------------------------------------------------------------------
* 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 withDefaults from '../../shared.webpack.config.mjs';
import path from 'path';
export default withDefaults({
context: path.join(import.meta.dirname),
entry: {
extension: './src/node/cssServerNodeMain.ts',
},
output: {
filename: 'cssServerMain.js',
path: path.join(import.meta.dirname, 'dist', 'node'),
}
});

View File

@@ -0,0 +1,7 @@
{
"extends": "./tsconfig.json",
"exclude": [
"./src/node/**",
"./src/test/**"
]
}