feat: introduce dumpUnimportComponents option

.gitignore

@@ -2,4 +2,5 @@ node_modules
 .DS_Store
 dist
 .idea
+.unimport-components.json
 components.d.ts

examples/vite-vue2/vite.config.ts

@@ -8,6 +8,7 @@ const config: UserConfig = {
     Components({
       transformer: 'vue2',
       dts: 'src/components.d.ts',
+      dumpUnimportComponents: true,
     }),
   ],
   build: {

examples/vite-vue3/vite.config.ts

@@ -37,6 +37,7 @@ const config: UserConfig = {
           componentPrefix: 'i',
         }),
       ],
+      dumpUnimportComponents: true,
     }),
   ],
   build: {

src/core/context.ts

@@ -6,7 +6,7 @@ import process from 'node:process'
 import { slash, throttle, toArray } from '@antfu/utils'
 import Debug from 'debug'
 import { DIRECTIVE_IMPORT_PREFIX } from './constants'
-import { writeDeclaration } from './declaration'
+import { writeComponentsJson, writeDeclaration } from './declaration'
 import { searchComponents } from './fs/glob'
 import { resolveOptions } from './options'
 import transformer from './transformer'
@@ -34,12 +34,23 @@ export class Context {
   root = process.cwd()
   sourcemap: string | boolean = true
   alias: Record<string, string> = {}
+  dumpUnimportComponentsPath: string | undefined
 
   constructor(
     private rawOptions: Options,
   ) {
     this.options = resolveOptions(rawOptions, this.root)
     this.generateDeclaration = throttle(500, this._generateDeclaration.bind(this), { noLeading: false })
+
+    if (this.options.dumpUnimportComponents) {
+      const dumpUnimportComponents = this.options.dumpUnimportComponents === true
+        ? './.unimport-components.json'
+        : this.options.dumpUnimportComponents ?? false
+
+      this.dumpUnimportComponentsPath = dumpUnimportComponents
+      this.generateComponentsJson = throttle(500, this._generateComponentsJson.bind(this), { noLeading: false })
+    }
+
     this.setTransformer(this.options.transformer)
   }
 
@@ -287,14 +298,26 @@ export class Context {
     if (!this.options.dts)
       return
 
-    debug.declaration('generating')
+    debug.declaration('generating dts')
     return writeDeclaration(this, this.options.dts, removeUnused)
   }
 
   generateDeclaration(removeUnused = !this._server): void {
     this._generateDeclaration(removeUnused)
   }
 
+  _generateComponentsJson(removeUnused = !this._server) {
+    if (!Object.keys(this._componentNameMap).length)
+      return
+
+    debug.components('generating components.json')
+    return writeComponentsJson(this, removeUnused)
+  }
+
+  generateComponentsJson(removeUnused = !this._server): void {
+    this._generateComponentsJson(removeUnused)
+  }
+
   get componentNameMap() {
     return this._componentNameMap
   }

src/core/declaration.ts

@@ -156,3 +156,22 @@ export async function writeDeclaration(ctx: Context, filepath: string, removeUnu
   if (code !== originalContent)
     await writeFile(filepath, code)
 }
+
+export async function writeComponentsJson(ctx: Context, _removeUnused = false) {
+  if (!ctx.dumpUnimportComponentsPath)
+    return
+
+  const components = [
+    ...Object.entries({
+      ...ctx.componentNameMap,
+      ...ctx.componentCustomMap,
+    }).map(([_, { name, as, from }]) => ({
+      name: name || 'default',
+      as,
+      from,
+    })),
+    ...resolveTypeImports(ctx.options.types),
+  ]
+
+  await writeFile(ctx.dumpUnimportComponentsPath, JSON.stringify(components, null, 2))
+}

src/core/unplugin.ts

@@ -43,6 +43,7 @@ export default createUnplugin<Options>((options = {}) => {
       try {
         const result = await ctx.transform(code, id)
         ctx.generateDeclaration()
+        ctx.generateComponentsJson()
         return result
       }
       catch (e) {
@@ -64,6 +65,11 @@ export default createUnplugin<Options>((options = {}) => {
             ctx.generateDeclaration()
         }
 
+        if (ctx.options.dumpUnimportComponents && ctx.dumpUnimportComponentsPath) {
+          if (!existsSync(ctx.dumpUnimportComponentsPath))
+            ctx.generateComponentsJson()
+        }
+
         if (config.build.watch && config.command === 'build')
           ctx.setupWatcher(chokidar.watch(ctx.options.globs))
       },

src/types.ts

@@ -198,6 +198,16 @@ export interface Options {
    * Vue version of project. It will detect automatically if not specified.
    */
   version?: 2 | 2.7 | 3
+
+  /**
+   * Save unimport components into a JSON file for other tools to consume.
+   * Provide a filepath to save the JSON file.
+   *
+   * When set to `true`, it will save to `./.unimport-components.json`
+   *
+   * @default false
+   */
+  dumpUnimportComponents?: boolean | string
 }
 
 export type ResolvedOptions = Omit<