From ac2b81c277dcdd0d246a088600081cefe0ee9e4f Mon Sep 17 00:00:00 2001 From: Ryan Roemer Date: Sun, 2 Mar 2025 18:34:55 -0800 Subject: [PATCH 1/4] WIP --- examples/one-page/index.html | 71 ++++++++++++++------------- examples/one-page/scripts/one-page.js | 2 +- 2 files changed, 37 insertions(+), 36 deletions(-) diff --git a/examples/one-page/index.html b/examples/one-page/index.html index b7adc7c6..2d34744a 100644 --- a/examples/one-page/index.html +++ b/examples/one-page/index.html @@ -9,45 +9,47 @@
+ diff --git a/examples/one-page/scripts/one-page.js b/examples/one-page/scripts/one-page.js index 3b1f1e5e..c6f0ace4 100644 --- a/examples/one-page/scripts/one-page.js +++ b/examples/one-page/scripts/one-page.js @@ -25,7 +25,7 @@ const reactPkgPath = require.resolve('react/package.json', { paths: [SPECTACLE_PATH] }); const { version: reactVersion } = require(reactPkgPath); -const DEPS = `deps=react@${reactVersion}`; +const DEPS = `deps=react@${reactVersion},react-dom@${reactVersion}`; // Toggle dev resources. (Use if debugging load / dependency errors). const IS_DEV = false; From cc7e97b39501ae941f7906985c9196bcb9f8549c Mon Sep 17 00:00:00 2001 From: Ryan Roemer Date: Sun, 2 Mar 2025 18:40:20 -0800 Subject: [PATCH 2/4] WIP --- examples/one-page/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/examples/one-page/index.html b/examples/one-page/index.html index 2d34744a..7b12f33d 100644 --- a/examples/one-page/index.html +++ b/examples/one-page/index.html @@ -14,7 +14,7 @@ { "imports": { "htm": "https://esm.sh/v121/htm@^3?dev&deps=react@18.2.0,react-dom@18.2.0", - "spectacle": "https://esm.sh/spectacle@10.1.8?bundle&dev&deps=react@18.2.0,react-dom@18.2.0", + "spectacle": "https://esm.sh/v121/spectacle@10.1.8?dev&deps=react@18.2.0,react-dom@18.2.0", "broadcast-channel": "https://esm.sh/v121/broadcast-channel@^4.17.0?dev&deps=react@18.2.0,react-dom@18.2.0", "history": "https://esm.sh/v121/history@^5.3.0?dev&deps=react@18.2.0,react-dom@18.2.0", "kbar": "https://esm.sh/v121/kbar@0.1.0-beta.40?dev&deps=react@18.2.0,react-dom@18.2.0", From e8fa687a5edc26b8e4db87c0db7ea92b68753b08 Mon Sep 17 00:00:00 2001 From: Ryan Roemer Date: Sun, 2 Mar 2025 18:43:46 -0800 Subject: [PATCH 3/4] Works --- examples/one-page/index.html | 62 ++++++++++++++++++------------------ 1 file changed, 31 insertions(+), 31 deletions(-) diff --git a/examples/one-page/index.html b/examples/one-page/index.html index 7b12f33d..ac00295f 100644 --- a/examples/one-page/index.html +++ b/examples/one-page/index.html @@ -13,37 +13,37 @@ From 7986539d40191a0681d81c2644bb1ff02e3e2709 Mon Sep 17 00:00:00 2001 From: Ryan Roemer Date: Sun, 2 Mar 2025 19:11:02 -0800 Subject: [PATCH 4/4] Fix importmap, use externals --- examples/js/index.js | 2 +- examples/one-page/index.html | 71 ++++++++++++++------------- examples/one-page/scripts/one-page.js | 14 +++--- 3 files changed, 45 insertions(+), 42 deletions(-) diff --git a/examples/js/index.js b/examples/js/index.js index b4e063b4..94c611c0 100644 --- a/examples/js/index.js +++ b/examples/js/index.js @@ -12,7 +12,6 @@ import { Slide, Deck, Text, - FitText, Grid, Box, Image, @@ -23,6 +22,7 @@ import { DefaultTemplate, SlideLayout } from 'spectacle'; +const FitText = Text; // TODO: NEED PUBLISH const formidableLogo = 'https://avatars2.githubusercontent.com/u/5078602?s=280&v=4'; diff --git a/examples/one-page/index.html b/examples/one-page/index.html index ac00295f..a6126a16 100644 --- a/examples/one-page/index.html +++ b/examples/one-page/index.html @@ -13,43 +13,42 @@ diff --git a/examples/one-page/scripts/one-page.js b/examples/one-page/scripts/one-page.js index c6f0ace4..8ea872d1 100644 --- a/examples/one-page/scripts/one-page.js +++ b/examples/one-page/scripts/one-page.js @@ -16,7 +16,7 @@ const SRC_FILE = path.join(EXAMPLES, 'js/index.js'); const DEST_FILE = path.join(EXAMPLES, 'one-page/index.html'); // Dependencies. -const ESM_SH_VERSION = 'v121'; // v121, stable, etc. +const ESM_SH_VERSION = ''; // 'v121/, stable, etc. const { dependencies, peerDependencies @@ -25,10 +25,10 @@ const reactPkgPath = require.resolve('react/package.json', { paths: [SPECTACLE_PATH] }); const { version: reactVersion } = require(reactPkgPath); -const DEPS = `deps=react@${reactVersion},react-dom@${reactVersion}`; +const EXTERNAL = `external=react,react-dom`; // Toggle dev resources. (Use if debugging load / dependency errors). -const IS_DEV = false; +const IS_DEV = true; const DEV = IS_DEV ? '&dev' : ''; // Use local built spectacle? Toggle to `true` for dev-only. @@ -39,13 +39,15 @@ const USE_LOCAL = false; // ================================================================================================ // Import Map // ================================================================================================ -const importUrl = (k, v, extra = '') => { +const importUrl = (k, v, extra = '', params = '') => { + let external = EXTERNAL; // Pin react and react-dom. if (k === 'react' || k === 'react-dom') { v = reactVersion; + external = ''; } - return `https://esm.sh/${ESM_SH_VERSION}/${k}@${v}${extra}?${DEPS}${DEV}`; + return `https://esm.sh/${ESM_SH_VERSION}${k}@${v}${extra}?${external}${params}${DEV}`; }; const getImportMap = () => { @@ -54,7 +56,7 @@ const getImportMap = () => { htm: importUrl('htm', '^3'), spectacle: USE_LOCAL ? '../../packages/spectacle/lib/index.mjs' - : 'https://esm.sh/spectacle@10?bundle' + : importUrl('spectacle', '10', '', '&bundle') }; Object.entries(Object.assign({}, dependencies, peerDependencies))