From 435bfec4e5c697c7d74b6b6a021c42e2b6a702b9 Mon Sep 17 00:00:00 2001 From: "Joshua A. Horton" Date: Fri, 15 Dec 2023 14:13:44 +0700 Subject: [PATCH] change(web): app/browser now uses common bundler script --- common/web/es-bundling/src/common-bundle.mts | 10 ++- web/common.inc.sh | 11 +-- web/src/app/browser/build-bundler.js | 76 -------------------- web/src/app/browser/build.sh | 19 ++++- 4 files changed, 32 insertions(+), 84 deletions(-) delete mode 100644 web/src/app/browser/build-bundler.js diff --git a/common/web/es-bundling/src/common-bundle.mts b/common/web/es-bundling/src/common-bundle.mts index 9ce8227d7d..ab8556a190 100644 --- a/common/web/es-bundling/src/common-bundle.mts +++ b/common/web/es-bundling/src/common-bundle.mts @@ -9,6 +9,7 @@ let MINIFY = false; let sourceFromArgs; let destFromArgs; let profilePath; +let sourceRoot; function doHelp(errCode?: number) { console.log(` @@ -16,7 +17,7 @@ Summary: Uses esbuild to generate bundled-JS according to common, repo-wide KeymanWeb-oriented settings. Usage: - common-bundle.mjs --outDir [options...] + common-bundle.mjs --out [options...] Parameters: : Fully-bundled and compiled JS file to be wrapped. @@ -30,6 +31,7 @@ Options: If not specified, 'iife' will be used. --minify Enables minification. --profile= Generates an associated filesize profile at the specified path. + --sourceRoot= Sets the sourceRoot for generated source maps ` ); process.exit(errCode || 0); } @@ -64,6 +66,9 @@ if(process.argv.length > 2) { case '--profile': profilePath = process.argv[++i]; break; + case '--sourceRoot': + sourceRoot = process.argv[++i]; + break; default: if(!sourceFromArgs) { sourceFromArgs = arg; @@ -111,7 +116,8 @@ const config: esbuild.BuildOptions = { entryPoints: [sourceFile], outfile: destFile, minify: MINIFY, - metafile: !!profilePath + metafile: !!profilePath, + sourceRoot: sourceRoot, // may be undefined - is fine if so. }; await prepareTslibTreeshaking(config); diff --git a/web/common.inc.sh b/web/common.inc.sh index e1594c911c..9daf05a914 100644 --- a/web/common.inc.sh +++ b/web/common.inc.sh @@ -1,6 +1,8 @@ #!/usr/bin/env bash # +BUNDLE_CMD="node $KEYMAN_ROOT/common/web/es-bundling/build/common-bundle.mjs" + # Compiles all build products corresponding to the specified target. # This should be called from the working directory of a child project's # build script. @@ -20,16 +22,15 @@ function compile() { fi local COMPILE_TARGET="$1" - local BUNDLE_FLAG="${2:-}" tsc -b "${KEYMAN_ROOT}/web/src/$COMPILE_TARGET" if [ -f "./build-bundler.js" ]; then - node "./build-bundler.js" "$BUNDLE_FLAG" - - # So... tsc does declaration-bundling on its own pretty well, at least for local development. - tsc --emitDeclarationOnly --outFile "${KEYMAN_ROOT}/web/build/$COMPILE_TARGET/lib/index.d.ts" -p "${KEYMAN_ROOT}/web/src/$COMPILE_TARGET" + node "./build-bundler.js" fi + + # So... tsc does declaration-bundling on its own pretty well, at least for local development. + tsc --emitDeclarationOnly --outFile "${KEYMAN_ROOT}/web/build/$COMPILE_TARGET/lib/index.d.ts" -p "${KEYMAN_ROOT}/web/src/$COMPILE_TARGET" } function _copy_dir_if_exists() { diff --git a/web/src/app/browser/build-bundler.js b/web/src/app/browser/build-bundler.js deleted file mode 100644 index 056806260a..0000000000 --- a/web/src/app/browser/build-bundler.js +++ /dev/null @@ -1,76 +0,0 @@ -/* - * Note: while this file is not meant to exist long-term, it provides a nice - * low-level proof-of-concept for esbuild bundling of the various Web submodules. - * - * Add some extra code at the end of src/index.ts and run it to verify successful bundling! - */ - -import esbuild from 'esbuild'; -import fs from 'fs'; -import { esmConfiguration, iifeConfiguration, prepareTslibTreeshaking } from '../../../../common/web/es-bundling/build/index.mjs'; - -let EMIT_FILESIZE_PROFILE = false; - -if(process.argv.length > 2) { - for(let i = 2; i < process.argv.length; i++) { - const arg = process.argv[i]; - - switch(arg) { - case '': - break; - case '--ci': - EMIT_FILESIZE_PROFILE=true - break; - // May add other options if desired in the future. - default: - console.error("Invalid command-line option set for script; only --ci is permitted."); - process.exit(1); - } - } -} - -const commonConfig = { - ...iifeConfiguration, - entryPoints: { - 'index': '../../../build/app/browser/obj/debug-main.js', - }, - outfile: '../../../build/app/browser/debug/keymanweb.js', - // `esbuild`'s sourcemap output puts relative paths to the original sources from the - // directory of the build output. The following keeps repo structure intact and - // puts our code under a common 'namespace' of sorts. - sourceRoot: '@keymanapp/keyman/web/build/app/browser/debug/' -}; - -await prepareTslibTreeshaking(commonConfig, /worker-main\.wrapped(?:\.min)?\.js/); - -// And now... do the actual builds. -await esbuild.build(commonConfig); - -let result = await esbuild.build({ - ...commonConfig, - entryPoints: { - 'index': '../../../build/app/browser/obj/release-main.js', - }, - // Enables source-file output size profiling! - metafile: true, - minify: true, - outfile: '../../../build/app/browser/release/keymanweb.js', -}); - -let filesizeProfile = await esbuild.analyzeMetafile(result.metafile, { verbose: true }); -fs.writeFileSync('../../../build/app/browser/filesize-profile.log', ` -// Minified Keyman Engine for Web ('app/browser' target), filesize profile -${filesizeProfile} -`); -if(EMIT_FILESIZE_PROFILE) { - // Profiles the sourcecode! - console.log(filesizeProfile); -} - -await esbuild.build({ - ...esmConfiguration, - entryPoints: { - 'index': '../../../build/app/browser/obj/test-index.js', - }, - outfile: '../../../build/app/browser/lib/index.mjs' -}); \ No newline at end of file diff --git a/web/src/app/browser/build.sh b/web/src/app/browser/build.sh index 56ee6faa8a..54fae132d9 100755 --- a/web/src/app/browser/build.sh +++ b/web/src/app/browser/build.sh @@ -53,6 +53,23 @@ compile_and_copy() { fi compile $SUBPROJECT_NAME $COMPILE_FLAGS + BUILD_ROOT="${KEYMAN_ROOT}/web/build/app/browser" + + $BUNDLE_CMD "${BUILD_ROOT}/obj/debug-main.js" \ + --out "${BUILD_ROOT}/debug/keymanweb.js" \ + --sourceRoot "@keymanapp/keyman/web/build/app/browser/debug" + + $BUNDLE_CMD "${BUILD_ROOT}/obj/release-main.js" \ + --out "${BUILD_ROOT}/release/keymanweb.js" \ + --profile "${BUILD_ROOT}/filesize-profile.log" \ + --sourceRoot "@keymanapp/keyman/web/build/app/browser/release" \ + --minify + + $BUNDLE_CMD "${BUILD_ROOT}/obj/test-index.js" \ + --out "${BUILD_ROOT}/lib/index.js" \ + --sourceRoot "@keymanapp/keyman/web/build/app/browser/lib" \ + --format esm + mkdir -p "$KEYMAN_ROOT/web/build/app/resources/osk" cp -R "$KEYMAN_ROOT/web/src/resources/osk/." "$KEYMAN_ROOT/web/build/app/resources/osk/" @@ -61,7 +78,7 @@ compile_and_copy() { local PROFILE_DEST="$KEYMAN_ROOT/web/build/profiling/" mkdir -p "$PROFILE_DEST" - cp "$KEYMAN_ROOT/web/build/app/browser/filesize-profile.log" "$PROFILE_DEST/web-engine-filesize.log" + cp "${BUILD_ROOT}/filesize-profile.log" "$PROFILE_DEST/web-engine-filesize.log" cp "$KEYMAN_ROOT/common/web/lm-worker/build/filesize-profile.log" "$PROFILE_DEST/lm-worker-filesize.log" }