执行npm run build-storybook报错TypeError: 无法转undefined/null为对象

报错栈指向vite-plugin-dts/dist/index.mjs:581:100的Object.values()调用，说明该插件在处理配置时，尝试对一个undefined或null的对象执行values方法。本地运行Storybook时，Vite的配置解析流程可能未触发该插件的这个逻辑分支，但执行build-storybook时会走完整的生产构建配置流程，从而暴露问题。

以下是几种可行的修复方式：

1. 在Storybook构建中禁用vite-plugin-dts #

Storybook静态构建不需要生成TypeScript类型声明，可直接在Storybook配置中过滤掉该插件：
修改.storybook/main.js，添加viteFinal方法：

import type { StorybookConfig } from '@storybook/react-vite'

const config: StorybookConfig = {
  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
  addons: [
    '@storybook/addon-links',
    '@storybook/addon-essentials',
    '@storybook/addon-onboarding',
    '@storybook/addon-interactions',
  ],
  framework: {
    name: '@storybook/react-vite',
    options: {},
  },
  docs: {
    autodocs: 'tag',
  },
  core: {
    builder: '@storybook/builder-vite', 
  },
  // 添加以下配置
  viteFinal: async (config) => {
    // 过滤掉vite-plugin-dts插件
    config.plugins = config.plugins?.filter(plugin => 
      !(plugin.name && plugin.name.includes('vite-plugin-dts'))
    );
    return config;
  },
}
export default config

2. 修复vite-plugin-dts的配置 #

检查项目根目录的vite.config.ts/js，确保传入vite-plugin-dts的所有配置项都有有效值，比如避免rollupTypes等选项设为null或undefined：

// vite.config.ts示例
import { defineConfig } from 'vite';
import dts from 'vite-plugin-dts';

export default defineConfig({
  plugins: [
    dts({
      // 确保配置项不为空，比如明确设置rollupTypes为true/false
      rollupTypes: true,
      // 其他配置项也需避免undefined
      outputDir: 'dist/types'
    })
  ]
});

3. 更新vite-plugin-dts到最新版本 #

该问题可能是插件的已知bug，更新到最新版本可修复：

npm update vite-plugin-dts --save-dev
# 或使用yarn
yarn upgrade vite-plugin-dts --latest

4. 检查Vite配置的条件逻辑 #

如果你的Vite配置中有基于环境变量的条件判断，确保Storybook构建时能正确初始化所有配置项，比如避免在非生产环境下返回未定义的插件配置。

内容的提问来源于stack exchange，提问作者podeig