Vite+React 18构建时自定义类型包@custom/dashboard-types解析失败的解决方法求助

嘿，我之前也遇到过几乎一模一样的Vite解析纯类型自定义包的问题，给你几个亲测有效的解决思路：

• 给自定义类型包补充入口字段
  你的@custom/dashboard-types包只配置了types字段，但Vite的模块解析器默认会尝试读取main或module这类入口字段来定位包的文件。你可以直接修改这个包的package.json，补充几个关键字段：

  "main": "index.d.ts",
  "module": "index.d.ts",
  "exports": {
    ".": {
      "types": "./index.d.ts"
    }
  }
  

  其中exports是更现代的包入口配置方式，能精准指定类型文件的位置，补上之后Vite的解析器就能正确识别这个包的结构了。修改完记得重新发布包，再在项目里更新依赖到最新版本。

• 在Vite配置中跳过该包的预构建
  如果你暂时没法修改自定义包的配置（比如没有发布权限），可以在项目的vite.config.js/ts里配置优化规则，告诉Vite这个包是纯类型包，不需要进行预构建处理：

  import { defineConfig } from 'vite'
  import react from '@vitejs/plugin-react'
  
  export default defineConfig({
    plugins: [react()],
    optimizeDeps: {
      exclude: ['@custom/dashboard-types']
    }
  })
  

  这样Vite就不会试图去解析这个包的执行代码，只会让TypeScript处理它的类型定义，避免触发解析错误。如果你的项目涉及SSR，还可以加上ssr.noExternal配置确保兼容。

• 使用类型专属的导入语法
  确保你在项目里导入这个包的类型时，用TypeScript的import type语法，而不是普通的import：

  import type { DashboardConfig, WidgetType } from '@custom/dashboard-types'
  

  这种语法能明确告诉Vite和TypeScript，这只是类型导入，不需要把它当成可执行模块来处理，从根源上减少解析冲突的可能。

内容来源于stack exchange