描述问题

我正在尝试将我的storybook上传到github pages,遇到了这个问题，有人能帮忙解决吗？
更多信息：
node版本：v20.15.1
storybook: "^8.2.5"
next: "14.2.5",

components/Typography.tsx

'use client'

import React from 'react'
import { THEMES } from '@/config/themes'
type TVariantsAndThemesTypography = {
  theme: 'theme1' | 'theme2' | 'theme3'
  variant: 'h1' | 'h2' | 'h3' | 'body-1' | 'body-2' | 'caption' | 'overline'
}

export const Typography: React.FC<
  TVariantsAndThemesTypography & { children: React.ReactNode }
> = ({ children, ...props }) => {
  const { theme, variant } = props

  switch (variant) {
    case 'h1':
      return <h1 className={THEMES[theme].h1}>{children}</h1>
    case 'h2':
      return <h2 className={THEMES[theme].h2}>{children}</h2>
    case 'h3':
      return <h3 className={THEMES[theme].h3}>{children}</h3>
    case 'body-1':
      return <p className={THEMES[theme]['body-1']}>{children}</p>
    case 'body-2':
      return <p className={THEMES[theme]['body-2']}>{children}</p>
    case 'caption':
      return <p className={THEMES[theme].caption}>{children}</p>
    case 'overline':
      return <p className={THEMES[theme].overline}>{children}</p>
    default:
      return <p className={THEMES[theme]['body-1']}>{children}</p>
  }
}

Typography.displayName = 'Typography'

components/Typography.stories.tsx

import type { Meta, StoryObj } from '@storybook/react'
import { Typography } from './Typography'

export default {
  title: 'Componentes/Tipografias',
  component: Typography,
  args: {
    children:
      'Lorem ipsum, dolor sit amet consectetur adipisicing elit. Porro reprehenderit est veniam? Rem recusandae sint perspiciatis debitis corrupti. Deserunt neque exercitationem illo voluptatum laudantium culpa suscipit accusantium blanditiis voluptas numquam.',
  },
} as Meta

type Story = StoryObj<typeof Typography>

export const h1: Story = {
  args: {
    variant: 'h1',
    theme: 'theme1',
  },
}

export const h2: Story = {
  args: {
    variant: 'h2',
    theme: 'theme1',
  },
}

export const h3: Story = {
  args: {
    variant: 'h3',
    theme: 'theme1',
  },
}

export const Body1: Story = {
  args: {
    variant: 'body-1',
    theme: 'theme1',
  },
}

export const Body2: Story = {
  args: {
    variant: 'body-2',
    theme: 'theme1',
  },
}

export const Caption: Story = {
  args: {
    variant: 'caption',
    theme: 'theme1',
  },
}

export const Overline: Story = {
  args: {
    variant: 'overline',
    theme: 'theme1',
  },
}

storybook/main.ts

import type { StorybookConfig } from '@storybook/nextjs'

const config: StorybookConfig = {
  stories: [
    '../components/**/*.mdx',
    '../components/**/*.stories.@(js|jsx|mjs|ts|tsx)',
    '../stories/**/*.mdx',
  ],
  addons: [
    '@storybook/addon-onboarding',
    '@storybook/addon-links',
    '@storybook/addon-essentials',
    '@chromatic-com/storybook',
    '@storybook/addon-interactions',
    '@storybook/addon-themes',
  ],
  framework: {
    name: '@storybook/nextjs',
    options: {},
  },
  staticDirs: ['../public'],
}
export default config

storybook/preview.ts

import type { Preview } from '@storybook/react'
import '../app/globals.css'

import { withThemeByClassName } from '@storybook/addon-themes'

const preview: Preview = {
 parameters: {
   backgrounds: {
     default: 'dark',
   },
   controls: {
     matchers: {
       color: /(background|color)$/i,
       date: /Date$/i,
     },
   },
 },
 tags: ['autodocs'],
 decorators: [
   withThemeByClassName({
     themes: {
       theme1: 'theme1',
       theme2: 'theme2',
       theme3: 'theme3',
     },
     defaultTheme: 'theme1',
   }),
 ],
}

export default preview

.github/workflows/deploy-github-pages.yaml

name: Build and Publish Storybook to GitHub Pages

on:
  push:
    branches:
      - 'design-system' 

permissions:
  contents: read
  pages: write
  id-token: write

jobs:
  deploy:
    environment:
      name: github-pages
      url: ${{ steps.build-publish.outputs.page_url }}
    runs-on: ubuntu-latest
    steps:
    - id: build-publish
      uses: bitovi/github-actions-storybook-to-github-pages@v1.0.3
      with:
        path: storybook-static 
        install_command: npm install
        build_command: npm run build-storybook

复现链接

https://stackblitz.com/edit/github-kcfh3e?file=.storybook%2Fpreview.ts

复现步骤

根据stackblitz链接中的信息，尝试在github pages中构建和部署storybook,你将会遇到与我面临的相同的错误。