From 1d1360ee5b9993f2ffa9d2bd6c6935c121f40195 Mon Sep 17 00:00:00 2001 From: Mrau Hu Date: Fri, 7 Jan 2022 06:33:33 +0300 Subject: [PATCH] Created `listStories()` function and removed duplicated code. TODO: Merge with #182 --- .../codegen-iframe-script.ts | 20 +++--------------- .../codegen-importfn-script.ts | 20 ++++-------------- .../storybook-builder-vite/list-stories.ts | 21 +++++++++++++++++++ .../storybook-builder-vite/optimizeDeps.ts | 20 +++++------------- 4 files changed, 33 insertions(+), 48 deletions(-) create mode 100644 packages/storybook-builder-vite/list-stories.ts diff --git a/packages/storybook-builder-vite/codegen-iframe-script.ts b/packages/storybook-builder-vite/codegen-iframe-script.ts index 0fc0aa20..607133d0 100644 --- a/packages/storybook-builder-vite/codegen-iframe-script.ts +++ b/packages/storybook-builder-vite/codegen-iframe-script.ts @@ -1,9 +1,7 @@ -import * as path from 'path'; -import { promise as glob } from 'glob-promise'; -import { normalizePath } from 'vite'; import { loadPreviewOrConfigFile } from '@storybook/core-common'; +import { normalizePath } from 'vite'; +import { listStories } from './list-stories'; -import type { StoriesEntry } from '@storybook/core-common'; import type { ExtendedOptions } from './types'; // This is somewhat of a hack; the problem is that previewEntries resolves to @@ -25,19 +23,7 @@ export async function generateIframeScriptCode(options: ExtendedOptions) { const presetEntries = await presets.apply('config', [], options); const configEntries = [...presetEntries, previewOrConfigFile].filter(Boolean); - const storyEntries = ( - await Promise.all( - ( - await presets.apply>('stories') - ).map((storiesEntry) => { - const files = typeof storiesEntry === 'string' ? storiesEntry : storiesEntry.files; - if (!files) { - return [] as string[]; - } - return glob(path.isAbsolute(files) ? files : path.join(configDir, files)); - }) - ) - ).reduce((carry, stories) => carry.concat(stories), []); + const storyEntries = await listStories(options); const absoluteFilesToImport = (files: string[], name: string) => files.map((el, i) => `import ${name ? `* as ${name}_${i} from ` : ''}'/@fs/${normalizePath(el)}'`).join('\n'); diff --git a/packages/storybook-builder-vite/codegen-importfn-script.ts b/packages/storybook-builder-vite/codegen-importfn-script.ts index e5047207..a0e3577a 100644 --- a/packages/storybook-builder-vite/codegen-importfn-script.ts +++ b/packages/storybook-builder-vite/codegen-importfn-script.ts @@ -1,8 +1,8 @@ -import { promise as glob } from 'glob-promise'; import * as path from 'path'; import { normalizePath } from 'vite'; +import { listStories } from './list-stories'; -import type { Options, StoriesEntry } from '@storybook/core-common'; +import type { Options } from '@storybook/core-common'; /** * This file is largely based on https://github.com/storybookjs/storybook/blob/d1195cbd0c61687f1720fefdb772e2f490a46584/lib/core-common/src/utils/to-importFn.ts @@ -40,21 +40,9 @@ async function toImportFn(stories: string[]) { `; } -export async function generateImportFnScriptCode({ configDir, presets }: Options) { +export async function generateImportFnScriptCode(options: Options) { // First we need to get an array of stories and their absolute paths. - const stories = ( - await Promise.all( - ( - await presets.apply>('stories') - ).map((storiesEntry) => { - const files = typeof storiesEntry === 'string' ? storiesEntry : storiesEntry.files; - if (!files) { - return [] as string[]; - } - return glob(path.isAbsolute(files) ? files : path.join(configDir, files)); - }) - ) - ).reduce((carry, stories) => carry.concat(stories), []); + const stories = await listStories(options); // We can then call toImportFn to create a function that can be used to load each story dynamically. return (await toImportFn(stories)).trim(); diff --git a/packages/storybook-builder-vite/list-stories.ts b/packages/storybook-builder-vite/list-stories.ts new file mode 100644 index 00000000..f047431e --- /dev/null +++ b/packages/storybook-builder-vite/list-stories.ts @@ -0,0 +1,21 @@ +import * as path from 'path'; +import { promise as glob } from 'glob-promise'; + +import type { Options, StoriesEntry } from '@storybook/core-common'; + +// TODO: Merge with https://github.com/eirslett/storybook-builder-vite/pull/182 +export async function listStories({ presets, configDir }: Options) { + return ( + await Promise.all( + ( + await presets.apply>('stories') + ).map((storiesEntry) => { + const files = typeof storiesEntry === 'string' ? storiesEntry : storiesEntry.files; + if (!files) { + return [] as string[]; + } + return glob(path.isAbsolute(files) ? files : path.join(configDir, files)); + }) + ) + ).reduce((carry, stories) => carry.concat(stories), []); +} diff --git a/packages/storybook-builder-vite/optimizeDeps.ts b/packages/storybook-builder-vite/optimizeDeps.ts index 29a9c15c..7fffb166 100644 --- a/packages/storybook-builder-vite/optimizeDeps.ts +++ b/packages/storybook-builder-vite/optimizeDeps.ts @@ -1,22 +1,12 @@ import * as path from 'path'; +import { normalizePath } from 'vite'; +import { listStories } from './list-stories'; -import type { StoriesEntry } from '@storybook/core-common'; import type { ExtendedOptions } from './types'; -export async function getOptimizeDeps(root: string, { configDir, presets }: ExtendedOptions) { - const stories = await Promise.all( - ( - await presets.apply>('stories') - ) - .map((storiesEntry) => { - const files = typeof storiesEntry === 'string' ? storiesEntry : storiesEntry.files; - if (!files) { - return undefined; - } - return path.relative(root, path.isAbsolute(files) ? files : path.join(configDir, files)); - }) - .filter((path): path is string => typeof path !== 'undefined') - ); +export async function getOptimizeDeps(root: string, options: ExtendedOptions) { + const absoluteStories = await listStories(options); + const stories = absoluteStories.map((storyPath) => normalizePath(path.relative(root, storyPath))); return { // We don't need to resolve the glob since vite supports globs for entries.