使用Vite构建组件库，如何排除npm包中的.stories及stories.d文件？

核心原因：类型声明文件的处理独立于普通源码打包 #

Vite里，普通源码文件（.vue/.ts这类）的排除是靠Rollup配置控制，但类型声明文件（.d.ts）的生成、打包逻辑是单独走的——要是你的组件库用了@vitejs/plugin-vue（内置dts支持）或者@rollup/plugin-dts，这些插件会单独扫描生成类型文件，不会自动继承Rollup的exclude规则。你之前写的glob规则只覆盖了源码打包环节，没同步处理类型声明的过滤逻辑，这就是.stories.d.ts还被打包的原因。

具体解决步骤 #

根据你用的插件类型，补充对应的排除规则：

1. 用@vitejs/plugin-vue的Vue组件库场景 #

插件内置了dts生成能力，直接在插件配置里加exclude：

import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';

export default defineConfig({
  plugins: [
    vue({
      dts: {
        // 补充类型声明的排除规则
        exclude: ['**/*.stories.ts', '**/*.stories.d.ts']
      }
    })
  ],
  build: {
    rollupOptions: {
      // 保留原有源码文件的排除规则
      exclude: ['**/*.stories.ts', '**/*.stories.d.ts'],
      // 其他Rollup配置...
    }
  }
});

2. 手动引入@rollup/plugin-dts的场景 #

如果是单独配置dts插件，直接在插件参数里指定排除规则：

import { defineConfig } from 'vite';
import dts from '@rollup/plugin-dts';

export default defineConfig({
  plugins: [
    // 其他插件配置...
    dts({
      exclude: ['**/*.stories.ts', '**/*.stories.d.ts']
    })
  ],
  build: {
    rollupOptions: {
      exclude: ['**/*.stories.ts', '**/*.stories.d.ts'],
      // 其他Rollup配置...
    }
  }
});

3. 额外校验点 #

就算你用glob-tool验证过规则，也得确认两点：

• 路径是基于项目根目录的，Vite配置里的glob路径默认以项目根为基准，别用相对路径导致匹配失效
• 规则是否覆盖嵌套目录：**/*.stories.d.ts能匹配所有子目录下的目标文件，确保没有遗漏的目录场景

验证方式 #

改完配置后执行vite build，去dist目录里检查.stories.d.ts是否被排除；也可以开启打包debug模式，查看dts插件的扫描日志，确认目标文件是否被跳过。

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