fix: #7

Author: antfu

package.json

@@ -18,6 +18,8 @@
   ],
   "scripts": {
     "dev": "npm run build -- --watch",
+    "fixture:dev": "npm -C test/fixture run dev",
+    "fixture:build": "npm -C test/fixture run build",
     "build": "tsup src/index.ts --dts --format cjs,esm",
     "prepublish": "npm run build",
     "release": "standard-version && npm publish && git push"

src/context.ts

@@ -38,7 +38,7 @@ export class Context {
 
   addComponents(paths: string | string[]) {
     const size = this._componentPaths.size
-    toArray(paths).forEach(p => this._componentPaths.add(`/${p}`))
+    toArray(paths).forEach(p => this._componentPaths.add(p))
     if (this._componentPaths.size !== size) {
       this.updateComponentNameMap()
       return true
@@ -48,7 +48,7 @@ export class Context {
 
   removeComponents(paths: string | string[]) {
     const size = this._componentPaths.size
-    toArray(paths).forEach(p => this._componentPaths.delete(`/${p}`))
+    toArray(paths).forEach(p => this._componentPaths.delete(p))
     if (this._componentPaths.size !== size) {
       this.updateComponentNameMap()
       return true
@@ -83,6 +83,7 @@ export class Context {
     return names
       .map((name) => {
         const info = this._componentNameMap[name]
+        console.log('info', info, excludePaths)
         if (info && !excludePaths.includes(info.path))
           return info
         return undefined

src/generator/resolver.ts

@@ -18,7 +18,7 @@ export async function generateResolver(ctx: Context, reqPath: string) {
   debug('using', names, 'imported', components.map(i => i.name))
 
   return `
-    ${components.map(({ name, path }) => `import ${name} from "${path}"`).join('\n')}
+    ${components.map(({ name, path }) => `import ${name} from "/${path}"`).join('\n')}
 
     export default (components) => { 
       return Object.assign({}, { ${components.map(i => i.name).join(', ')} }, components) 

test/fixture/src/App.vue

@@ -2,4 +2,17 @@
   <ComponentA msg="a" />
   <component-b msg="b" />
   <ComponentC msg="c" />
+  <recursive :data="tree" />
 </template>
+
+<script setup lang='ts'>
+import { ref } from 'vue'
+
+export const tree = ref({
+  label: 'Top Level',
+  children: [
+    { label: 'First Level' },
+    { label: 'First Level', children: [{ label: 'Second Level' }] },
+  ],
+})
+</script>

test/fixture/src/components/Recursive.vue

@@ -0,0 +1,23 @@
+<template>
+  <div>
+    <div>{{ data.label }}</div>
+    <div class="child">
+      <recursive v-for="item in data.children" :data="item" />
+    </div>
+  </div>
+</template>
+
+<script lang="ts">
+export default {
+  name: 'Recursive',
+  props: {
+    data: Object,
+  },
+}
+</script>
+
+<style>
+.child {
+  margin-left: 2rem;
+}
+</style>