From 5a00b41ac293b24bfe340baf6f2278e4806fbfd2 Mon Sep 17 00:00:00 2001 From: Joey Pender Date: Fri, 5 Aug 2022 10:18:15 -0500 Subject: [PATCH 1/7] adding sourcemap inlining task --- cli/src/tasks/sourcemaps.ts | 51 +++++++++++++++++++++++++++++++++++++ cli/src/tasks/sync.ts | 2 ++ 2 files changed, 53 insertions(+) create mode 100644 cli/src/tasks/sourcemaps.ts diff --git a/cli/src/tasks/sourcemaps.ts b/cli/src/tasks/sourcemaps.ts new file mode 100644 index 0000000000..2f46b60325 --- /dev/null +++ b/cli/src/tasks/sourcemaps.ts @@ -0,0 +1,51 @@ +import { + readdirSync, + existsSync, + readFileSync, + writeFileSync, + unlinkSync, +} from '@ionic/utils-fs'; +import { join, extname } from 'path'; +import type { Config } from '../definitions'; +import { logger } from '../log'; + +export async function inlineSourceMaps( + config: Config, + platformName: string, +): Promise { + let buildDir = ''; + + if (platformName == config.ios.name) { + logger.info( + `inlining sourcemaps for ${platformName} - ${await config.ios.webDirAbs}`, + ); + buildDir = await config.ios.webDirAbs; + } + + if (platformName == config.android.name) { + logger.info( + `inlining sourcemaps for ${platformName} - ${await config.android.webDirAbs}`, + ); + buildDir = await config.android.webDirAbs; + } + + if (buildDir) { + buildDir += "/static/js" + const files = readdirSync(buildDir); + files.forEach(file => { + const mapFile = join(buildDir, `${file}.map`); + if (extname(file) === '.js' && existsSync(mapFile)) { + const targetFile = join(buildDir, file); + const bufMap = readFileSync(mapFile).toString('base64'); + const bufFile = readFileSync(targetFile, 'utf8'); + const result = bufFile.replace( + `sourceMappingURL=${file}.map`, + 'sourceMappingURL=data:application/json;charset=utf-8;base64,' + + bufMap, + ); + writeFileSync(targetFile, result); + unlinkSync(mapFile); + } + }); + } +} diff --git a/cli/src/tasks/sync.ts b/cli/src/tasks/sync.ts index 9ce3cd9cbc..e53ca3f31f 100644 --- a/cli/src/tasks/sync.ts +++ b/cli/src/tasks/sync.ts @@ -12,6 +12,7 @@ import { logger } from '../log'; import { allSerial } from '../util/promise'; import { copy, copyCommand } from './copy'; +import { inlineSourceMaps } from "./sourcemaps"; import { update, updateChecks, updateCommand } from './update'; /** @@ -70,6 +71,7 @@ export async function sync( try { await copy(config, platformName); + await inlineSourceMaps(config, platformName); } catch (e) { logger.error(e.stack ?? e); } From 423366f45575d7810f84a6ed64604e743914b1ce Mon Sep 17 00:00:00 2001 From: Joey Pender Date: Fri, 5 Aug 2022 12:38:05 -0500 Subject: [PATCH 2/7] locate correct js directory --- cli/src/tasks/sourcemaps.ts | 29 +++++++++++++++++++++-------- 1 file changed, 21 insertions(+), 8 deletions(-) diff --git a/cli/src/tasks/sourcemaps.ts b/cli/src/tasks/sourcemaps.ts index 2f46b60325..ca2b70e340 100644 --- a/cli/src/tasks/sourcemaps.ts +++ b/cli/src/tasks/sourcemaps.ts @@ -9,6 +9,22 @@ import { join, extname } from 'path'; import type { Config } from '../definitions'; import { logger } from '../log'; + +function findJSAssetsDir(buildDir: string): string { + const reactJSDir = "/static/js"; + const vueJSDir = "/js"; + + if (existsSync(buildDir + reactJSDir)) { + return reactJSDir; + } + + if (existsSync(buildDir + vueJSDir)) { + return vueJSDir; + } + + return "/"; +} + export async function inlineSourceMaps( config: Config, platformName: string, @@ -16,21 +32,18 @@ export async function inlineSourceMaps( let buildDir = ''; if (platformName == config.ios.name) { - logger.info( - `inlining sourcemaps for ${platformName} - ${await config.ios.webDirAbs}`, - ); buildDir = await config.ios.webDirAbs; } - if (platformName == config.android.name) { - logger.info( - `inlining sourcemaps for ${platformName} - ${await config.android.webDirAbs}`, - ); + if (platformName == config.android.name) { buildDir = await config.android.webDirAbs; } if (buildDir) { - buildDir += "/static/js" + logger.info("Inlining sourcemaps") + let jsAssetsDir = findJSAssetsDir(buildDir); + buildDir += jsAssetsDir; + const files = readdirSync(buildDir); files.forEach(file => { const mapFile = join(buildDir, `${file}.map`); From 52aafaf7253d692df8271476d801686a5ee86c11 Mon Sep 17 00:00:00 2001 From: Joey Pender Date: Mon, 8 Aug 2022 10:11:09 -0500 Subject: [PATCH 3/7] =?UTF-8?q?adds=20an=20`=E2=80=94inline`=20sync=20flag?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- cli/src/index.ts | 9 +++++++-- cli/src/tasks/add.ts | 2 +- cli/src/tasks/run.ts | 2 +- cli/src/tasks/sync.ts | 8 ++++++-- 4 files changed, 15 insertions(+), 6 deletions(-) diff --git a/cli/src/index.ts b/cli/src/index.ts index c6fe92409d..91d0eaf162 100644 --- a/cli/src/index.ts +++ b/cli/src/index.ts @@ -83,12 +83,17 @@ export function runProgram(config: Config): void { '--deployment', "Optional: if provided, Podfile.lock won't be deleted and pod install will use --deployment option", ) + .option( + '--inline', + "Optional: if true, all source maps will be lined for easier debugging on mobile devices", + false + ) .action( wrapAction( - telemetryAction(config, async (platform, { deployment }) => { + telemetryAction(config, async (platform, { deployment, inline }) => { checkExternalConfig(config.app); const { syncCommand } = await import('./tasks/sync'); - await syncCommand(config, platform, deployment); + await syncCommand(config, platform, deployment, inline); }), ), ); diff --git a/cli/src/tasks/add.ts b/cli/src/tasks/add.ts index e027eb5287..6094221c1c 100644 --- a/cli/src/tasks/add.ts +++ b/cli/src/tasks/add.ts @@ -104,7 +104,7 @@ export async function addCommand( await editPlatforms(config, platformName); if (await pathExists(config.app.webDirAbs)) { - await sync(config, platformName, false); + await sync(config, platformName, false, false); if (platformName === config.android.name) { await runTask('Syncing Gradle', async () => { return createLocalProperties(config.android.platformDirAbs); diff --git a/cli/src/tasks/run.ts b/cli/src/tasks/run.ts index 6644e93681..17f2ae60ab 100644 --- a/cli/src/tasks/run.ts +++ b/cli/src/tasks/run.ts @@ -80,7 +80,7 @@ export async function runCommand( try { if (options.sync) { - await sync(config, platformName, false); + await sync(config, platformName, false, true); } await run(config, platformName, options); diff --git a/cli/src/tasks/sync.ts b/cli/src/tasks/sync.ts index e53ca3f31f..e63485054d 100644 --- a/cli/src/tasks/sync.ts +++ b/cli/src/tasks/sync.ts @@ -22,6 +22,7 @@ export async function syncCommand( config: Config, selectedPlatformName: string, deployment: boolean, + inline: boolean ): Promise { if (selectedPlatformName && !(await isValidPlatform(selectedPlatformName))) { try { @@ -41,7 +42,7 @@ export async function syncCommand( ]); await allSerial( platforms.map( - platformName => () => sync(config, platformName, deployment), + platformName => () => sync(config, platformName, deployment, inline), ), ); const now = +new Date(); @@ -61,6 +62,7 @@ export async function sync( config: Config, platformName: string, deployment: boolean, + inline: boolean ): Promise { await runPlatformHook( config, @@ -71,7 +73,9 @@ export async function sync( try { await copy(config, platformName); - await inlineSourceMaps(config, platformName); + if (inline) { + await inlineSourceMaps(config, platformName); + } } catch (e) { logger.error(e.stack ?? e); } From 35dcbb135fe9d7aa6176bc620b2decbf2b4eb0e4 Mon Sep 17 00:00:00 2001 From: Joey Pender Date: Mon, 8 Aug 2022 11:40:56 -0500 Subject: [PATCH 4/7] typo --- cli/src/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/cli/src/index.ts b/cli/src/index.ts index 91d0eaf162..80391b3d2a 100644 --- a/cli/src/index.ts +++ b/cli/src/index.ts @@ -85,7 +85,7 @@ export function runProgram(config: Config): void { ) .option( '--inline', - "Optional: if true, all source maps will be lined for easier debugging on mobile devices", + "Optional: if true, all source maps will be inlined for easier debugging on mobile devices", false ) .action( From d4ae7005268855b8994a01452ca47927501e9262 Mon Sep 17 00:00:00 2001 From: Joey Pender Date: Mon, 8 Aug 2022 12:27:40 -0500 Subject: [PATCH 5/7] fmt --- cli/src/index.ts | 4 ++-- cli/src/tasks/sourcemaps.ts | 26 +++++++++++++------------- cli/src/tasks/sync.ts | 8 ++++---- 3 files changed, 19 insertions(+), 19 deletions(-) diff --git a/cli/src/index.ts b/cli/src/index.ts index 80391b3d2a..f3c4eaf873 100644 --- a/cli/src/index.ts +++ b/cli/src/index.ts @@ -85,8 +85,8 @@ export function runProgram(config: Config): void { ) .option( '--inline', - "Optional: if true, all source maps will be inlined for easier debugging on mobile devices", - false + 'Optional: if true, all source maps will be inlined for easier debugging on mobile devices', + false, ) .action( wrapAction( diff --git a/cli/src/tasks/sourcemaps.ts b/cli/src/tasks/sourcemaps.ts index ca2b70e340..8147ef5311 100644 --- a/cli/src/tasks/sourcemaps.ts +++ b/cli/src/tasks/sourcemaps.ts @@ -6,23 +6,23 @@ import { unlinkSync, } from '@ionic/utils-fs'; import { join, extname } from 'path'; + import type { Config } from '../definitions'; import { logger } from '../log'; - function findJSAssetsDir(buildDir: string): string { - const reactJSDir = "/static/js"; - const vueJSDir = "/js"; + const reactJSDir = '/static/js'; + const vueJSDir = '/js'; - if (existsSync(buildDir + reactJSDir)) { - return reactJSDir; - } + if (existsSync(buildDir + reactJSDir)) { + return reactJSDir; + } - if (existsSync(buildDir + vueJSDir)) { - return vueJSDir; - } + if (existsSync(buildDir + vueJSDir)) { + return vueJSDir; + } - return "/"; + return '/'; } export async function inlineSourceMaps( @@ -35,13 +35,13 @@ export async function inlineSourceMaps( buildDir = await config.ios.webDirAbs; } - if (platformName == config.android.name) { + if (platformName == config.android.name) { buildDir = await config.android.webDirAbs; } if (buildDir) { - logger.info("Inlining sourcemaps") - let jsAssetsDir = findJSAssetsDir(buildDir); + logger.info('Inlining sourcemaps'); + const jsAssetsDir = findJSAssetsDir(buildDir); buildDir += jsAssetsDir; const files = readdirSync(buildDir); diff --git a/cli/src/tasks/sync.ts b/cli/src/tasks/sync.ts index e63485054d..8af82c2af7 100644 --- a/cli/src/tasks/sync.ts +++ b/cli/src/tasks/sync.ts @@ -12,7 +12,7 @@ import { logger } from '../log'; import { allSerial } from '../util/promise'; import { copy, copyCommand } from './copy'; -import { inlineSourceMaps } from "./sourcemaps"; +import { inlineSourceMaps } from './sourcemaps'; import { update, updateChecks, updateCommand } from './update'; /** @@ -22,7 +22,7 @@ export async function syncCommand( config: Config, selectedPlatformName: string, deployment: boolean, - inline: boolean + inline: boolean, ): Promise { if (selectedPlatformName && !(await isValidPlatform(selectedPlatformName))) { try { @@ -62,7 +62,7 @@ export async function sync( config: Config, platformName: string, deployment: boolean, - inline: boolean + inline: boolean, ): Promise { await runPlatformHook( config, @@ -75,7 +75,7 @@ export async function sync( await copy(config, platformName); if (inline) { await inlineSourceMaps(config, platformName); - } + } } catch (e) { logger.error(e.stack ?? e); } From 1d94a459701530243406eecd25931bd2b52bdace Mon Sep 17 00:00:00 2001 From: Joey Pender Date: Tue, 9 Aug 2022 15:12:24 -0500 Subject: [PATCH 6/7] Walk the entire build assets folder for JS files --- cli/src/tasks/sourcemaps.ts | 54 ++++++++++++++++--------------------- 1 file changed, 23 insertions(+), 31 deletions(-) diff --git a/cli/src/tasks/sourcemaps.ts b/cli/src/tasks/sourcemaps.ts index 8147ef5311..f0ae8f4c14 100644 --- a/cli/src/tasks/sourcemaps.ts +++ b/cli/src/tasks/sourcemaps.ts @@ -4,25 +4,35 @@ import { readFileSync, writeFileSync, unlinkSync, + lstatSync, } from '@ionic/utils-fs'; import { join, extname } from 'path'; import type { Config } from '../definitions'; import { logger } from '../log'; -function findJSAssetsDir(buildDir: string): string { - const reactJSDir = '/static/js'; - const vueJSDir = '/js'; - if (existsSync(buildDir + reactJSDir)) { - return reactJSDir; - } - - if (existsSync(buildDir + vueJSDir)) { - return vueJSDir; - } - - return '/'; +function walkDirectory(dirPath: string) { + const files = readdirSync(dirPath); + files.forEach(file => { + const targetFile = join(dirPath, file); + if (existsSync(targetFile) && lstatSync(targetFile).isDirectory()) { + walkDirectory(targetFile); + } else { + const mapFile = join(dirPath, `${file}.map`) + if (extname(file) === '.js' && existsSync(mapFile)) { + const bufMap = readFileSync(mapFile).toString('base64'); + const bufFile = readFileSync(targetFile, 'utf8'); + const result = bufFile.replace( + `sourceMappingURL=${file}.map`, + 'sourceMappingURL=data:application/json;charset=utf-8;base64,' + + bufMap, + ); + writeFileSync(targetFile, result); + unlinkSync(mapFile); + } + } + }); } export async function inlineSourceMaps( @@ -41,24 +51,6 @@ export async function inlineSourceMaps( if (buildDir) { logger.info('Inlining sourcemaps'); - const jsAssetsDir = findJSAssetsDir(buildDir); - buildDir += jsAssetsDir; - - const files = readdirSync(buildDir); - files.forEach(file => { - const mapFile = join(buildDir, `${file}.map`); - if (extname(file) === '.js' && existsSync(mapFile)) { - const targetFile = join(buildDir, file); - const bufMap = readFileSync(mapFile).toString('base64'); - const bufFile = readFileSync(targetFile, 'utf8'); - const result = bufFile.replace( - `sourceMappingURL=${file}.map`, - 'sourceMappingURL=data:application/json;charset=utf-8;base64,' + - bufMap, - ); - writeFileSync(targetFile, result); - unlinkSync(mapFile); - } - }); + walkDirectory(buildDir); } } From a5df265a52e3ee1f1ec2ac96f0ca87949f870f69 Mon Sep 17 00:00:00 2001 From: Joey Pender Date: Tue, 9 Aug 2022 15:12:52 -0500 Subject: [PATCH 7/7] fmt --- cli/src/tasks/sourcemaps.ts | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/cli/src/tasks/sourcemaps.ts b/cli/src/tasks/sourcemaps.ts index f0ae8f4c14..54b79fe5d7 100644 --- a/cli/src/tasks/sourcemaps.ts +++ b/cli/src/tasks/sourcemaps.ts @@ -11,16 +11,15 @@ import { join, extname } from 'path'; import type { Config } from '../definitions'; import { logger } from '../log'; - function walkDirectory(dirPath: string) { const files = readdirSync(dirPath); files.forEach(file => { const targetFile = join(dirPath, file); if (existsSync(targetFile) && lstatSync(targetFile).isDirectory()) { walkDirectory(targetFile); - } else { - const mapFile = join(dirPath, `${file}.map`) - if (extname(file) === '.js' && existsSync(mapFile)) { + } else { + const mapFile = join(dirPath, `${file}.map`); + if (extname(file) === '.js' && existsSync(mapFile)) { const bufMap = readFileSync(mapFile).toString('base64'); const bufFile = readFileSync(targetFile, 'utf8'); const result = bufFile.replace(