From 2b89fc6ff49274f0a269c636b5bdbffae2af25fd Mon Sep 17 00:00:00 2001 From: Mark Lundin Date: Mon, 26 Feb 2024 13:10:48 +0000 Subject: [PATCH 1/3] Add rollup transform --- utils/rollup-build-target.mjs | 2 ++ utils/rollup-dynamic-import-transform.mjs | 25 +++++++++++++++++++++++ 2 files changed, 27 insertions(+) create mode 100644 utils/rollup-dynamic-import-transform.mjs diff --git a/utils/rollup-build-target.mjs b/utils/rollup-build-target.mjs index 4dddabe7e01..beabc21d388 100644 --- a/utils/rollup-build-target.mjs +++ b/utils/rollup-build-target.mjs @@ -11,6 +11,7 @@ import { visualizer } from 'rollup-plugin-visualizer'; import { shaderChunks } from './rollup-shader-chunks.mjs'; import { engineLayerImportValidation } from './rollup-import-validation.mjs'; import { spacesToTabs } from './rollup-spaces-to-tabs.mjs'; +import { dynamicImportTransform } from './rollup-dynamic-import-transform.mjs'; import { version, revision } from './rollup-version-revision.mjs'; import { getBanner } from './rollup-get-banner.mjs'; @@ -177,6 +178,7 @@ function buildTarget(buildType, moduleFormat, input = 'src/index.js', buildDir = output: outputOptions, plugins: [ jscc(jsccParam), + moduleFormat === 'es5' ? dynamicImportTransform() : undefined, shaderChunks({ enabled: buildType !== 'debug' }), engineLayerImportValidation(input, buildType === 'debug'), buildType !== 'debug' ? strip(stripOptions) : undefined, diff --git a/utils/rollup-dynamic-import-transform.mjs b/utils/rollup-dynamic-import-transform.mjs new file mode 100644 index 00000000000..b4ed67aaf45 --- /dev/null +++ b/utils/rollup-dynamic-import-transform.mjs @@ -0,0 +1,25 @@ +/** + * This rollup plugin transform code with dynamic import statements and wraps them + * in a `new Function('import("modulePath")')` statement, in order to avoid parsing errors in older browsers + * without support for dynamic imports. + * + * Note that whilst this will prevent parsing errors, it will + */ + +export function dynamicImportTransform() { + return { + name: 'dynamic-import-transform', + transform(code, id) { + /** + * Transforms the code by replacing `import(` with `new Function("return import")(`. + * @param {string} code - The code to transform. + * @param {string} id - The id of the code. + * @returns {object} - The transformed code and map. + */ + return { + code: code.replace(/import\(/g, 'new Function("modulePath", "return import(modulePath)")('), + map: null + }; + } + }; +} From 678fd64569ba1299b6e004c9dd770e6fe44f3dbf Mon Sep 17 00:00:00 2001 From: Mark Lundin Date: Mon, 26 Feb 2024 14:08:50 +0000 Subject: [PATCH 2/3] added further commenting --- utils/rollup-dynamic-import-transform.mjs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/utils/rollup-dynamic-import-transform.mjs b/utils/rollup-dynamic-import-transform.mjs index b4ed67aaf45..51f00203ef0 100644 --- a/utils/rollup-dynamic-import-transform.mjs +++ b/utils/rollup-dynamic-import-transform.mjs @@ -3,7 +3,7 @@ * in a `new Function('import("modulePath")')` statement, in order to avoid parsing errors in older browsers * without support for dynamic imports. * - * Note that whilst this will prevent parsing errors, it will + * Note that whilst this will prevent parsing errors, it can trigger CSP errors. */ export function dynamicImportTransform() { From 1afd181447fad52b81a33512756cfd0b37ea8246 Mon Sep 17 00:00:00 2001 From: Mark Lundin Date: Wed, 28 Feb 2024 09:15:56 +0000 Subject: [PATCH 3/3] Update utils/rollup-dynamic-import-transform.mjs Co-authored-by: KPal <48248865+kpal81xd@users.noreply.github.com> --- utils/rollup-dynamic-import-transform.mjs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/utils/rollup-dynamic-import-transform.mjs b/utils/rollup-dynamic-import-transform.mjs index 51f00203ef0..20a08851ee2 100644 --- a/utils/rollup-dynamic-import-transform.mjs +++ b/utils/rollup-dynamic-import-transform.mjs @@ -17,7 +17,7 @@ export function dynamicImportTransform() { * @returns {object} - The transformed code and map. */ return { - code: code.replace(/import\(/g, 'new Function("modulePath", "return import(modulePath)")('), + code: code.replace(/([^\w])import\(/g, '$1new Function("modulePath", "return import(modulePath)")('), map: null }; }