From 8d637e1f006560fb2901f7f7796340db71f70159 Mon Sep 17 00:00:00 2001 From: Michael Shilman Date: Wed, 26 Apr 2023 00:01:17 +0800 Subject: [PATCH] Merge pull request #22247 from storybookjs/norbert/bundle-manager-to-js Core: Rename manager UI mjs to js --- code/lib/builder-manager/src/index.ts | 4 +- .../builder-manager/src/utils/files.test.ts | 10 +- code/lib/builder-manager/src/utils/files.ts | 2 +- .../src/utils/managerEntries.ts | 2 +- .../builder-manager/templates/template.ejs | 6 +- code/lib/builder-vite/input/iframe.html | 2 +- code/lib/builder-vite/src/build.ts | 2 +- code/lib/builder-vite/src/index.ts | 2 +- .../src/plugins/external-globals-plugin.ts | 4 +- code/lib/builder-webpack5/src/index.ts | 2 +- .../builder-webpack5/templates/preview.ejs | 2 +- code/lib/preview/package.json | 14 +- code/package.json | 3 +- .../ErrorFormatter/ErrorFormatter.stories.tsx | 74 +++--- code/ui/manager/package.json | 18 +- code/yarn.lock | 178 +------------- scripts/prepare/bundle.ts | 11 +- scripts/prepare/esm-bundle.ts | 223 ++++++++++++++++++ 18 files changed, 307 insertions(+), 252 deletions(-) create mode 100755 scripts/prepare/esm-bundle.ts diff --git a/code/lib/builder-manager/src/index.ts b/code/lib/builder-manager/src/index.ts index 944662e562ac..a3e20675dd70 100644 --- a/code/lib/builder-manager/src/index.ts +++ b/code/lib/builder-manager/src/index.ts @@ -49,7 +49,7 @@ export const getConfig: ManagerBuilder['getConfig'] = async (options) => { write: false, ignoreAnnotations: true, resolveExtensions: ['.ts', '.tsx', '.mjs', '.js', '.jsx'], - outExtension: { '.js': '.mjs' }, + outExtension: { '.js': '.js' }, loader: { '.js': 'jsx', '.png': 'dataurl', @@ -234,7 +234,7 @@ const builder: BuilderFunction = async function* builderGeneratorFn({ startTime, filter: (src) => { const { ext } = parse(src); if (ext) { - return ext === '.mjs'; + return ext === '.js'; } return true; }, diff --git a/code/lib/builder-manager/src/utils/files.test.ts b/code/lib/builder-manager/src/utils/files.test.ts index 2cdb1f0d4c59..c3f1157b11d4 100644 --- a/code/lib/builder-manager/src/utils/files.test.ts +++ b/code/lib/builder-manager/src/utils/files.test.ts @@ -11,8 +11,8 @@ test('sanitizePath', () => { const text = 'demo text'; const file = { path: isWindows - ? 'C:\\Users\\username\\Projects\\projectname\\storybook\\node_modules\\@storybook\\addon-x+y\\dist\\manager.mjs' - : '/Users/username/Projects/projectname/storybook/node_modules/@storybook/addon-x+y/dist/manager.mjs', + ? 'C:\\Users\\username\\Projects\\projectname\\storybook\\node_modules\\@storybook\\addon-x+y\\dist\\manager.js' + : '/Users/username/Projects/projectname/storybook/node_modules/@storybook/addon-x+y/dist/manager.js', contents: Uint8Array.from(Array.from(text).map((letter) => letter.charCodeAt(0))), text, }; @@ -20,10 +20,10 @@ test('sanitizePath', () => { expect(location).toEqual( isWindows - ? 'C:\\Users\\username\\Projects\\projectname\\storybook\\node_modules\\@storybook\\addon-x+y\\dist\\manager.mjs' - : '/Users/username/Projects/projectname/storybook/node_modules/@storybook/addon-x+y/dist/manager.mjs' + ? 'C:\\Users\\username\\Projects\\projectname\\storybook\\node_modules\\@storybook\\addon-x+y\\dist\\manager.js' + : '/Users/username/Projects/projectname/storybook/node_modules/@storybook/addon-x+y/dist/manager.js' ); expect(url).toMatchInlineSnapshot( - `"./sb-addons/node_modules/%40storybook/addon-x%2By/dist/manager.mjs"` + `"./sb-addons/node_modules/%40storybook/addon-x%2By/dist/manager.js"` ); }); diff --git a/code/lib/builder-manager/src/utils/files.ts b/code/lib/builder-manager/src/utils/files.ts index bca197dcda9e..1532fa700c6f 100644 --- a/code/lib/builder-manager/src/utils/files.ts +++ b/code/lib/builder-manager/src/utils/files.ts @@ -19,7 +19,7 @@ export async function readOrderedFiles( }) || [] ); - const jsFiles = files.filter((file) => file.endsWith('.mjs')); + const jsFiles = files.filter((file) => file.endsWith('.js')); const cssFiles = files.filter((file) => file.endsWith('.css')); return { cssFiles, jsFiles }; } diff --git a/code/lib/builder-manager/src/utils/managerEntries.ts b/code/lib/builder-manager/src/utils/managerEntries.ts index 264aa81366fb..c6ac46a0a242 100644 --- a/code/lib/builder-manager/src/utils/managerEntries.ts +++ b/code/lib/builder-manager/src/utils/managerEntries.ts @@ -42,7 +42,7 @@ export async function wrapManagerEntries(entrypoints: string[]) { const base = relative(process.cwd(), dir); const location = join( cacheLocation, - sanitizeFinal(join(`${sanitizeBase(base)}-${i}`, `${sanitizeBase(name)}-bundle.mjs`)) + sanitizeFinal(join(`${sanitizeBase(base)}-${i}`, `${sanitizeBase(name)}-bundle.js`)) ); await fs.ensureFile(location); diff --git a/code/lib/builder-manager/templates/template.ejs b/code/lib/builder-manager/templates/template.ejs index 5e51830c97ef..462a83649e9c 100644 --- a/code/lib/builder-manager/templates/template.ejs +++ b/code/lib/builder-manager/templates/template.ejs @@ -27,7 +27,7 @@ /> - + <% files.js.forEach(file => { %> @@ -57,13 +57,13 @@ <% } %> - + diff --git a/code/lib/builder-vite/input/iframe.html b/code/lib/builder-vite/input/iframe.html index 1c24f67f98a8..ee6c9d165832 100644 --- a/code/lib/builder-vite/input/iframe.html +++ b/code/lib/builder-vite/input/iframe.html @@ -35,7 +35,7 @@
- + diff --git a/code/lib/builder-vite/src/build.ts b/code/lib/builder-vite/src/build.ts index 0de0a0fd5282..0a75cc71b3a2 100644 --- a/code/lib/builder-vite/src/build.ts +++ b/code/lib/builder-vite/src/build.ts @@ -15,7 +15,7 @@ export async function build(options: Options) { sourcemap: true, rollupOptions: { // Do not try to bundle the storybook runtime, it is copied into the output dir after the build. - external: ['./sb-preview/runtime.mjs'], + external: ['./sb-preview/runtime.js'], }, }, }).build; diff --git a/code/lib/builder-vite/src/index.ts b/code/lib/builder-vite/src/index.ts index 36393ec3c190..614dc87bc561 100644 --- a/code/lib/builder-vite/src/index.ts +++ b/code/lib/builder-vite/src/index.ts @@ -92,7 +92,7 @@ export const build: ViteBuilder['build'] = async ({ options }) => { filter: (src) => { const { ext } = parse(src); if (ext) { - return ext === '.mjs'; + return ext === '.js'; } return true; }, diff --git a/code/lib/builder-vite/src/plugins/external-globals-plugin.ts b/code/lib/builder-vite/src/plugins/external-globals-plugin.ts index 60841e22bc97..fe5efe1bce4a 100644 --- a/code/lib/builder-vite/src/plugins/external-globals-plugin.ts +++ b/code/lib/builder-vite/src/plugins/external-globals-plugin.ts @@ -17,8 +17,8 @@ const replacementMap = new Map([ ]); /** - * This plugin swaps out imports of pre-bundled storybook preview modules for destructures from global - * variables that are added in runtime.mjs. + * This plugin swaps out imports of pre-bundled storybook preview modules for destructured from global + * variables that are added in runtime.js. * * For instance: * diff --git a/code/lib/builder-webpack5/src/index.ts b/code/lib/builder-webpack5/src/index.ts index 64b136972320..3ae9c53e9a99 100644 --- a/code/lib/builder-webpack5/src/index.ts +++ b/code/lib/builder-webpack5/src/index.ts @@ -296,7 +296,7 @@ const builder: BuilderFunction = async function* builderGeneratorFn({ startTime, filter: (src) => { const { ext } = parse(src); if (ext) { - return ext === '.mjs'; + return ext === '.js'; } return true; }, diff --git a/code/lib/builder-webpack5/templates/preview.ejs b/code/lib/builder-webpack5/templates/preview.ejs index b394765c5417..007f769a3eb0 100644 --- a/code/lib/builder-webpack5/templates/preview.ejs +++ b/code/lib/builder-webpack5/templates/preview.ejs @@ -44,7 +44,7 @@ <% } %>