Skip to content

Commit 1b5f99c

Browse files
committed
fix: revert #468
This reverts commit 0a47eab.
1 parent 71b94d0 commit 1b5f99c

File tree

7 files changed

+105
-92
lines changed

7 files changed

+105
-92
lines changed

src/addons/vue-template.ts

Lines changed: 15 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import type { Addon, Import } from '../types'
2-
import { stringifyImports, toTypeDeclarationItems } from '../utils'
2+
import { stringifyImports } from '../utils'
33

44
const contextRE = /\b_ctx\.([$\w]+)\b/g
55
const UNREF_KEY = '__unimport_unref_'
@@ -65,19 +65,24 @@ export function vueTemplateAddon(): Addon {
6565
},
6666
async declaration(dts, options) {
6767
const imports = await this.getImports()
68-
const items = toTypeDeclarationItems(imports.filter(i => !i.type && !i.dtsDisabled), options)
68+
const items = imports
69+
.map((i) => {
70+
if (i.type || i.dtsDisabled)
71+
return ''
72+
const from = options?.resolvePath?.(i) || i.from
73+
return `readonly ${i.as}: UnwrapRef<typeof import('${from}')${i.name !== '*' ? `['${i.name}']` : ''}>`
74+
})
75+
.filter(Boolean)
76+
.sort()
6977

70-
const extendItems = items.map(i => ` ${i}`).join('\n')
78+
const extendItems = items.map(i => ` ${i}`).join('\n')
7179
return `${dts}
7280
// for vue template auto import
73-
type UnwrapRefs<T> = {
74-
[K in keyof T]: import('vue').UnwrapRef<T[K]>
75-
}
76-
namespace _ComponentCustomProperties {
77-
${extendItems}
78-
}
81+
import { UnwrapRef } from 'vue'
7982
declare module 'vue' {
80-
interface ComponentCustomProperties extends UnwrapRefs<typeof _ComponentCustomProperties> {}
83+
interface ComponentCustomProperties {
84+
${extendItems}
85+
}
8186
}`
8287
},
8388
}

src/utils.ts

Lines changed: 34 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -148,66 +148,51 @@ export function dedupeImports(imports: Import[], warn: (msg: string) => void) {
148148
}
149149

150150
export function toExports(imports: Import[], fileDir?: string, includeType = false) {
151-
const map = toImportModuleMap(imports, includeType, (i) => {
152-
let from = stripFileExtension(i.from)
153-
if (fileDir && isAbsolute(from)) {
154-
from = relative(fileDir, from)
155-
if (from[0] !== '.' && from[0] !== '/')
156-
from = `./${from}`
157-
}
158-
return i.with
159-
? `'${from}' with ${stringifyWith(i.with)}`
160-
: `'${from}'`
161-
})
162-
151+
const map = toImportModuleMap(imports, includeType)
163152
return Object.entries(map)
164-
.flatMap(([from, imports]) => {
153+
.flatMap(([name, imports]) => {
154+
if (isFilePath(name))
155+
name = name.replace(/\.[a-z]+$/i, '')
156+
157+
if (fileDir && isAbsolute(name)) {
158+
name = relative(fileDir, name)
159+
if (!name.match(/^[./]/))
160+
name = `./${name}`
161+
}
165162
const entries: string[] = []
166163
const filtered = Array.from(imports).filter((i) => {
167-
if (i.name === '*' || i.name === '=') {
168-
entries.push(`export * as ${i.as} from ${from};`)
164+
if (i.name === '*') {
165+
entries.push(`export * as ${i.as} from '${name}';`)
169166
return false
170167
}
171168
return true
172169
})
173-
if (filtered.length) {
174-
const items = filtered.map(i => stringifyImportAlias(i, false)).join(', ')
175-
entries.push(`export { ${items} } from ${from};`)
176-
}
170+
if (filtered.length)
171+
entries.push(`export { ${filtered.map(i => stringifyImportAlias(i, false)).join(', ')} } from '${name}';`)
172+
177173
return entries
178174
})
179175
.join('\n')
180176
}
181177

182178
export function stripFileExtension(path: string) {
183-
return isFilePath(path)
184-
? path.replace(/\.[a-z]+$/i, '')
185-
: path
179+
return path.replace(/\.[a-z]+$/i, '')
186180
}
187181

188182
export function toTypeDeclarationItems(imports: Import[], options?: TypeDeclarationOptions) {
189-
const map = toImportModuleMap(imports, true, (i) => {
190-
const from = options?.resolvePath?.(i) || stripFileExtension(i.typeFrom || i.from)
191-
return i.with
192-
? `import('${from}', { with: ${stringifyWith(i.with)} })`
193-
: `import('${from}')`
194-
})
195-
196-
return Object.entries(map)
197-
.flatMap(([from, imports]) => {
198-
const entries: string[] = []
199-
const filtered = Array.from(imports).filter((i) => {
200-
if (i.name === '*' || i.name === '=') {
201-
entries.push(`const ${i.as}: typeof ${from}`)
202-
return false
203-
}
204-
return true
205-
})
206-
if (filtered.length) {
207-
const items = filtered.map(i => stringifyImportAlias(i, true)).sort().join(', ')
208-
entries.push(`const { ${items} }: typeof ${from}`)
209-
}
210-
return entries
183+
return imports
184+
.map((i) => {
185+
const from = options?.resolvePath?.(i) || stripFileExtension(i.typeFrom || i.from)
186+
let typeDef = ''
187+
if (i.with)
188+
typeDef += `import('${from}', { with: ${stringifyWith(i.with)} })`
189+
else
190+
typeDef += `import('${from}')`
191+
192+
if (i.name !== '*' && i.name !== '=')
193+
typeDef += `['${i.name}']`
194+
195+
return `const ${i.as}: typeof ${typeDef}`
211196
})
212197
.sort()
213198
}
@@ -297,15 +282,16 @@ function stringifyImportAlias(item: Import, isCJS = false) {
297282
: `${item.name} as ${item.as}`
298283
}
299284

300-
function toImportModuleMap(imports: Import[], includeType = false, getKey?: (i: Import) => string) {
285+
function toImportModuleMap(imports: Import[], includeType = false) {
301286
const map: Record<string, Set<Import>> = {}
302287
for (const _import of imports) {
303288
if (_import.type && !includeType)
304289
continue
305290

306-
const key = getKey?.(_import) || _import.from
307-
map[key] ??= new Set()
308-
map[key].add(_import)
291+
if (!map[_import.from])
292+
map[_import.from] = new Set()
293+
294+
map[_import.from].add(_import)
309295
}
310296
return map
311297
}

test/addon-extend-imports.test.ts

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -54,8 +54,11 @@ describe('addon extend imports', () => {
5454
.toMatchInlineSnapshot(`
5555
"export {}
5656
declare global {
57-
const { computed: computed1, ref: ref1, watch: watch1 }: typeof import('vue')
58-
const { useEffect, useState }: typeof import('react')
57+
const computed1: typeof import('vue')['computed']
58+
const ref1: typeof import('vue')['ref']
59+
const useEffect: typeof import('react')['useEffect']
60+
const useState: typeof import('react')['useState']
61+
const watch1: typeof import('vue')['watch']
5962
}"
6063
`)
6164
})
@@ -81,8 +84,12 @@ describe('addon extend imports', () => {
8184
.toMatchInlineSnapshot(`
8285
"export {}
8386
declare global {
84-
const { computed: computed1, foo: foo1, ref: ref1, watch: watch1 }: typeof import('vue')
85-
const { useEffect, useState }: typeof import('react')
87+
const computed1: typeof import('vue')['computed']
88+
const foo1: typeof import('vue')['foo']
89+
const ref1: typeof import('vue')['ref']
90+
const useEffect: typeof import('react')['useEffect']
91+
const useState: typeof import('react')['useState']
92+
const watch1: typeof import('vue')['watch']
8693
}"
8794
`)
8895
})

test/addon-inject-hooks.test.ts

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -43,8 +43,11 @@ describe('addon inject hooks', () => {
4343
.toMatchInlineSnapshot(`
4444
"export {}
4545
declare global {
46-
const { computed, ref, watch }: typeof import('vue')
47-
const { useEffect, useState }: typeof import('react')
46+
const computed: typeof import('vue')['computed']
47+
const ref: typeof import('vue')['ref']
48+
const useEffect: typeof import('react')['useEffect']
49+
const useState: typeof import('react')['useState']
50+
const watch: typeof import('vue')['watch']
4851
}"
4952
`)
5053
})

test/dts.test.ts

Lines changed: 30 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -62,22 +62,37 @@ it('dts', async () => {
6262
.toMatchInlineSnapshot(`
6363
"export {}
6464
declare global {
65+
const $: typeof import('jquery')['$']
66+
const CustomEnum: typeof import('<root>/playground/composables/index')['CustomEnum']
67+
const PascalCased: typeof import('<root>/playground/composables/PascalCased')['PascalCased']
6568
const THREE: typeof import('three')
66-
const { $ }: typeof import('jquery')
67-
const { CustomEnum, bump, localA, localBAlias, multiplier, useDoubled }: typeof import('<root>/playground/composables/index')
68-
const { PascalCased }: typeof import('<root>/playground/composables/PascalCased')
69-
const { bar, named }: typeof import('<root>/playground/composables/nested/bar/index')
70-
const { computed, reactive, ref, toRefs }: typeof import('vue')
71-
const { default: customDefault }: typeof import('default')
72-
const { default: foo }: typeof import('<root>/playground/composables/foo')
73-
const { default: nested }: typeof import('<root>/playground/composables/nested/index')
74-
const { doTheThing }: typeof import('my-macro-library', { with: { type: "macro" } })
75-
const { foobar }: typeof import('foobar')
76-
const { myBazFunction }: typeof import('<root>/playground/composables/nested/bar/baz')
77-
const { myfunc1, myfunc2 }: typeof import('<root>/playground/composables/nested/bar/named')
78-
const { subFoo }: typeof import('<root>/playground/composables/nested/bar/sub/index')
79-
const { useEffect, useRef, useState }: typeof import('react')
80-
const { vanillaA, vanillaAMJS, vanillaB, vanillaBMJS }: typeof import('<root>/playground/composables/vanilla')
69+
const bar: typeof import('<root>/playground/composables/nested/bar/index')['bar']
70+
const bump: typeof import('<root>/playground/composables/index')['bump']
71+
const computed: typeof import('vue')['computed']
72+
const customDefault: typeof import('default')['default']
73+
const doTheThing: typeof import('my-macro-library', { with: { type: "macro" } })['doTheThing']
74+
const foo: typeof import('<root>/playground/composables/foo')['default']
75+
const foobar: typeof import('foobar')['foobar']
76+
const localA: typeof import('<root>/playground/composables/index')['localA']
77+
const localBAlias: typeof import('<root>/playground/composables/index')['localBAlias']
78+
const multiplier: typeof import('<root>/playground/composables/index')['multiplier']
79+
const myBazFunction: typeof import('<root>/playground/composables/nested/bar/baz')['myBazFunction']
80+
const myfunc1: typeof import('<root>/playground/composables/nested/bar/named')['myfunc1']
81+
const myfunc2: typeof import('<root>/playground/composables/nested/bar/named')['myfunc2']
82+
const named: typeof import('<root>/playground/composables/nested/bar/index')['named']
83+
const nested: typeof import('<root>/playground/composables/nested/index')['default']
84+
const reactive: typeof import('vue')['reactive']
85+
const ref: typeof import('vue')['ref']
86+
const subFoo: typeof import('<root>/playground/composables/nested/bar/sub/index')['subFoo']
87+
const toRefs: typeof import('vue')['toRefs']
88+
const useDoubled: typeof import('<root>/playground/composables/index')['useDoubled']
89+
const useEffect: typeof import('react')['useEffect']
90+
const useRef: typeof import('react')['useRef']
91+
const useState: typeof import('react')['useState']
92+
const vanillaA: typeof import('<root>/playground/composables/vanilla')['vanillaA']
93+
const vanillaAMJS: typeof import('<root>/playground/composables/vanilla')['vanillaAMJS']
94+
const vanillaB: typeof import('<root>/playground/composables/vanilla')['vanillaB']
95+
const vanillaBMJS: typeof import('<root>/playground/composables/vanilla')['vanillaBMJS']
8196
}
8297
// for type re-export
8398
declare global {

test/vue-directives.test.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -178,10 +178,10 @@ describe('vue-directives', () => {
178178
expect(replaceRoot(await ctx.generateTypeDeclarations())).toMatchInlineSnapshot(`
179179
"export {}
180180
declare global {
181-
const { NamedDirective }: typeof import('<root>/directives/named-directive')
182-
const { default }: typeof import('<root>/directives/awesome-directive')
183-
const { default: FocusDirective }: typeof import('<root>/directives/v-focus-directive')
184-
const { vRippleDirective }: typeof import('<root>/directives/ripple-directive')
181+
const FocusDirective: typeof import('<root>/directives/v-focus-directive')['default']
182+
const NamedDirective: typeof import('<root>/directives/named-directive')['NamedDirective']
183+
const default: typeof import('<root>/directives/awesome-directive')['default']
184+
const vRippleDirective: typeof import('<root>/directives/ripple-directive')['vRippleDirective']
185185
}
186186
// for vue directives auto import
187187
declare module 'vue' {
@@ -664,7 +664,7 @@ describe('vue-directives', () => {
664664
expect(replaceRoot(await ctx.generateTypeDeclarations())).toMatchInlineSnapshot(`
665665
"export {}
666666
declare global {
667-
const { AwesomeDirective }: typeof import('<root>/directives/awesome-directive')
667+
const AwesomeDirective: typeof import('<root>/directives/awesome-directive')['AwesomeDirective']
668668
}
669669
// for vue directives auto import
670670
declare module 'vue' {

test/vue-template.test.ts

Lines changed: 5 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -74,17 +74,14 @@ describe('vue-template', () => {
7474
expect(await ctx.generateTypeDeclarations()).toMatchInlineSnapshot(`
7575
"export {}
7676
declare global {
77-
const { foo }: typeof import('foo')
77+
const foo: typeof import('foo')['foo']
7878
}
7979
// for vue template auto import
80-
type UnwrapRefs<T> = {
81-
[K in keyof T]: import('vue').UnwrapRef<T[K]>
82-
}
83-
namespace _ComponentCustomProperties {
84-
const { foo }: typeof import('foo')
85-
}
80+
import { UnwrapRef } from 'vue'
8681
declare module 'vue' {
87-
interface ComponentCustomProperties extends UnwrapRefs<typeof _ComponentCustomProperties> {}
82+
interface ComponentCustomProperties {
83+
readonly foo: UnwrapRef<typeof import('foo')['foo']>
84+
}
8885
}"
8986
`)
9087
})

0 commit comments

Comments
 (0)