From fb6cf37ea97976926638554d0e454c4b4b394237 Mon Sep 17 00:00:00 2001 From: Matt Bierner Date: Tue, 8 Mar 2022 16:23:14 -0800 Subject: [PATCH] Move simple-browser to use esbuild for webview scripts --- build/lib/extensions.js | 23 +++------- build/lib/extensions.ts | 24 +++------- .../markdown-language-features/yarn.lock | 8 ++-- extensions/simple-browser/esbuild-preview.js | 41 +++++++++++++++++ extensions/simple-browser/package.json | 3 +- extensions/simple-browser/webpack.config.js | 45 ------------------- 6 files changed, 58 insertions(+), 86 deletions(-) create mode 100644 extensions/simple-browser/esbuild-preview.js delete mode 100644 extensions/simple-browser/webpack.config.js diff --git a/build/lib/extensions.js b/build/lib/extensions.js index 76d2b8844e5..99ebc6dee2b 100644 --- a/build/lib/extensions.js +++ b/build/lib/extensions.js @@ -353,16 +353,13 @@ function translatePackageJSON(packageJSON, packageNLSPath) { } exports.translatePackageJSON = translatePackageJSON; const extensionsPath = path.join(root, 'extensions'); -// Additional projects to webpack. These typically build code for webviews -const webpackMediaConfigFiles = [ - 'simple-browser/webpack.config.js', -]; // Additional projects to run esbuild on. These typically build code for webviews const esbuildMediaScripts = [ 'markdown-language-features/esbuild-notebook.js', 'markdown-language-features/esbuild-preview.js', 'markdown-math/esbuild.js', - 'notebook-renderers/esbuild.js' + 'notebook-renderers/esbuild.js', + 'simple-browser/esbuild-preview.js', ]; async function webpackExtensions(taskName, isWatch, webpackConfigLocations) { const webpack = require('webpack'); @@ -468,17 +465,9 @@ async function esbuildExtensions(taskName, isWatch, scripts) { return Promise.all(tasks); } async function buildExtensionMedia(isWatch, outputRoot) { - return Promise.all([ - webpackExtensions('webpacking extension media', isWatch, webpackMediaConfigFiles.map(p => { - return { - configPath: path.join(extensionsPath, p), - outputRoot: outputRoot ? path.join(root, outputRoot, path.dirname(p)) : undefined - }; - })), - esbuildExtensions('esbuilding extension media', isWatch, esbuildMediaScripts.map(p => ({ - script: path.join(extensionsPath, p), - outputRoot: outputRoot ? path.join(root, outputRoot, path.dirname(p)) : undefined - }))), - ]); + return esbuildExtensions('esbuilding extension media', isWatch, esbuildMediaScripts.map(p => ({ + script: path.join(extensionsPath, p), + outputRoot: outputRoot ? path.join(root, outputRoot, path.dirname(p)) : undefined + }))); } exports.buildExtensionMedia = buildExtensionMedia; diff --git a/build/lib/extensions.ts b/build/lib/extensions.ts index 405404992de..aeea8e68852 100644 --- a/build/lib/extensions.ts +++ b/build/lib/extensions.ts @@ -434,17 +434,13 @@ export function translatePackageJSON(packageJSON: string, packageNLSPath: string const extensionsPath = path.join(root, 'extensions'); -// Additional projects to webpack. These typically build code for webviews -const webpackMediaConfigFiles = [ - 'simple-browser/webpack.config.js', -]; - // Additional projects to run esbuild on. These typically build code for webviews const esbuildMediaScripts = [ 'markdown-language-features/esbuild-notebook.js', 'markdown-language-features/esbuild-preview.js', 'markdown-math/esbuild.js', - 'notebook-renderers/esbuild.js' + 'notebook-renderers/esbuild.js', + 'simple-browser/esbuild-preview.js', ]; export async function webpackExtensions(taskName: string, isWatch: boolean, webpackConfigLocations: { configPath: string; outputRoot?: string }[]) { @@ -554,16 +550,8 @@ async function esbuildExtensions(taskName: string, isWatch: boolean, scripts: { } export async function buildExtensionMedia(isWatch: boolean, outputRoot?: string) { - return Promise.all([ - webpackExtensions('webpacking extension media', isWatch, webpackMediaConfigFiles.map(p => { - return { - configPath: path.join(extensionsPath, p), - outputRoot: outputRoot ? path.join(root, outputRoot, path.dirname(p)) : undefined - }; - })), - esbuildExtensions('esbuilding extension media', isWatch, esbuildMediaScripts.map(p => ({ - script: path.join(extensionsPath, p), - outputRoot: outputRoot ? path.join(root, outputRoot, path.dirname(p)) : undefined - }))), - ]); + return esbuildExtensions('esbuilding extension media', isWatch, esbuildMediaScripts.map(p => ({ + script: path.join(extensionsPath, p), + outputRoot: outputRoot ? path.join(root, outputRoot, path.dirname(p)) : undefined + }))); } diff --git a/extensions/markdown-language-features/yarn.lock b/extensions/markdown-language-features/yarn.lock index 5ab0b05f690..ee1ee244500 100644 --- a/extensions/markdown-language-features/yarn.lock +++ b/extensions/markdown-language-features/yarn.lock @@ -74,10 +74,10 @@ entities@~2.1.0: resolved "https://registry.yarnpkg.com/entities/-/entities-2.1.0.tgz#992d3129cf7df6870b96c57858c249a120f8b8b5" integrity sha512-hCx1oky9PFrJ611mf0ifBLBRW8lUUVRlFolb5gWRfIELabBlbp9xZvrqZLZAs+NxFnbfQoeGd8wDkygjg7U85w== -highlight.js@^10.4.1: - version "10.4.1" - resolved "https://registry.yarnpkg.com/highlight.js/-/highlight.js-10.4.1.tgz#d48fbcf4a9971c4361b3f95f302747afe19dbad0" - integrity sha512-yR5lWvNz7c85OhVAEAeFhVCc/GV4C30Fjzc/rCP0aCWzc1UUOPUk55dK/qdwTZHBvMZo+eZ2jpk62ndX/xMFlg== +highlight.js@^11.4.0: + version "11.4.0" + resolved "https://registry.yarnpkg.com/highlight.js/-/highlight.js-11.4.0.tgz#34ceadd49e1596ee5aba3d99346cdfd4845ee05a" + integrity sha512-nawlpCBCSASs7EdvZOYOYVkJpGmAOKMYZgZtUqSRqodZE0GRVcFKwo1RcpeOemqh9hyttTdd5wDBwHkuSyUfnA== linkify-it@^3.0.1: version "3.0.3" diff --git a/extensions/simple-browser/esbuild-preview.js b/extensions/simple-browser/esbuild-preview.js new file mode 100644 index 00000000000..cf278788b9b --- /dev/null +++ b/extensions/simple-browser/esbuild-preview.js @@ -0,0 +1,41 @@ +/*--------------------------------------------------------------------------------------------- + * Copyright (c) Microsoft Corporation. All rights reserved. + * Licensed under the MIT License. See License.txt in the project root for license information. + *--------------------------------------------------------------------------------------------*/ +const path = require('path'); +const fs = require('fs'); +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 outDir = path.join(outputRoot, 'media'); + +fs.copyFileSync( + path.join(__dirname, 'node_modules', 'vscode-codicons', 'dist', 'codicon.css'), + path.join(outDir, 'codicon.css')); + +fs.copyFileSync( + path.join(__dirname, 'node_modules', 'vscode-codicons', 'dist', 'codicon.ttf'), + path.join(outDir, 'codicon.ttf')); + +esbuild.build({ + entryPoints: [ + path.join(__dirname, 'preview-src', 'index.ts') + ], + bundle: true, + minify: true, + sourcemap: false, + format: 'esm', + outdir: outDir, + platform: 'browser', + target: ['es2020'], + incremental: isWatch, +}).catch(() => process.exit(1)); diff --git a/extensions/simple-browser/package.json b/extensions/simple-browser/package.json index 6ce11704fa4..3e3424e10cb 100644 --- a/extensions/simple-browser/package.json +++ b/extensions/simple-browser/package.json @@ -62,8 +62,7 @@ "watch": "npm run build-preview && gulp watch-extension:markdown-language-features", "vscode:prepublish": "npm run build-ext && npm run build-preview", "build-ext": "node ../../node_modules/gulp/bin/gulp.js --gulpfile ../../build/gulpfile.extensions.js compile-extension:markdown-language-features ./tsconfig.json", - "build-preview": "npx webpack-cli --mode development", - "build-preview-production": "npx webpack-cli --mode production", + "build-preview": "node ./esbuild-preview", "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" }, diff --git a/extensions/simple-browser/webpack.config.js b/extensions/simple-browser/webpack.config.js deleted file mode 100644 index fbdf2a6c597..00000000000 --- a/extensions/simple-browser/webpack.config.js +++ /dev/null @@ -1,45 +0,0 @@ -/*--------------------------------------------------------------------------------------------- - * Copyright (c) Microsoft Corporation. All rights reserved. - * Licensed under the MIT License. See License.txt in the project root for license information. - *--------------------------------------------------------------------------------------------*/ -const path = require('path'); -const CopyPlugin = require('copy-webpack-plugin'); - -module.exports = { - context: path.resolve(__dirname), - entry: { - index: './preview-src/index.ts', - }, - mode: 'production', - module: { - rules: [ - { - test: /\.tsx?$/, - use: 'ts-loader', - exclude: /node_modules/ - } - ] - }, - resolve: { - extensions: ['.tsx', '.ts', '.js'] - }, - output: { - filename: '[name].js', - path: path.resolve(__dirname, 'media') - }, - plugins: [ - // @ts-ignore - new CopyPlugin({ - patterns: [ - { - from: './node_modules/vscode-codicons/dist/codicon.css', - to: 'codicon.css' - }, - { - from: './node_modules/vscode-codicons/dist/codicon.ttf', - to: 'codicon.ttf' - }, - ], - }), - ] -};