Skip to content

Commit 4d6b364

Browse files
lishaobosnabaonanfengxiaodong28CCherry07antfu
authored
feat: introduce dtsTsx for TSX support (#673)
Co-authored-by: 内小子 <[email protected]> Co-authored-by: FENG/XIAODONG <[email protected]> Co-authored-by: Cherry7 <[email protected]> Co-authored-by: 内小子 <[email protected]> Co-authored-by: Anthony Fu <[email protected]>
1 parent 9bc45c2 commit 4d6b364

File tree

6 files changed

+108
-17
lines changed

6 files changed

+108
-17
lines changed

‎README.md‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -423,6 +423,10 @@ Components({
423423
// default: `true` if package typescript is installed
424424
dts: false,
425425

426+
// generate dts with TSX support
427+
// default: `true` if `@vitejs/plugin-vue-jsx` is installed
428+
dtsTsx: false,
429+
426430
// Allow subdirectories as namespace prefix for components.
427431
directoryAsNamespace: false,
428432

‎src/core/declaration.ts‎

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -116,10 +116,12 @@ export function getDeclaration(ctx: Context, filepath: string, originalImports?:
116116

117117
let code = `/* eslint-disable */
118118
// @ts-nocheck
119-
// Generated by unplugin-vue-components
120-
// Read more: https://github.com/vuejs/core/pull/3399
121119
// biome-ignore lint: disable
122120
// oxlint-disable
121+
// ------
122+
// Generated by unplugin-vue-components
123+
// Read more: https://github.com/vuejs/core/pull/3399
124+
${ctx.options.dtsTsx ? `import { GlobalComponents } from 'vue'\n` : ''}
123125
export {}
124126
125127
/* prettier-ignore */
@@ -138,6 +140,17 @@ declare module 'vue' {`
138140
}`
139141
}
140142
code += '\n}\n'
143+
144+
// for TSX support
145+
if (ctx.options.dtsTsx) {
146+
if (Object.keys(declarations.component).length > 0) {
147+
code += `
148+
// For TSX support
149+
declare global {
150+
${declarations.component.map(d => d.replace(/(.+):/, 'const $1:')).join('\n ')}
151+
}`
152+
}
153+
}
141154
return code
142155
}
143156

‎src/core/options.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ export const defaultOptions: Omit<Required<Options>, 'include' | 'exclude' | 'ex
1010
extensions: 'vue',
1111
deep: true,
1212
dts: isPackageExists('typescript'),
13+
dtsTsx: isPackageExists('@vitejs/plugin-vue-jsx'),
1314

1415
directoryAsNamespace: false,
1516
collapseSamePrefixes: false,

‎src/types.ts‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -176,6 +176,14 @@ export interface Options {
176176
*/
177177
dts?: boolean | string
178178

179+
/**
180+
* Generate TypeScript declaration for global components
181+
* For TSX support
182+
*
183+
* @default true if `@vitejs/plugin-vue-jsx` is installed
184+
*/
185+
dtsTsx?: boolean
186+
179187
/**
180188
* Do not emit warning on component overriding
181189
*
@@ -243,6 +251,7 @@ export type ResolvedOptions = Omit<
243251
globs: string[]
244252
globsExclude: string[]
245253
dts: string | false
254+
dtsTsx: boolean
246255
root: string
247256
}
248257

‎test/__snapshots__/dts.test.ts.snap‎

Lines changed: 63 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,12 @@
33
exports[`dts > components only 1`] = `
44
"/* eslint-disable */
55
// @ts-nocheck
6-
// Generated by unplugin-vue-components
7-
// Read more: https://github.com/vuejs/core/pull/3399
86
// biome-ignore lint: disable
97
// oxlint-disable
8+
// ------
9+
// Generated by unplugin-vue-components
10+
// Read more: https://github.com/vuejs/core/pull/3399
11+
1012
export {}
1113
1214
/* prettier-ignore */
@@ -23,10 +25,12 @@ declare module 'vue' {
2325
exports[`dts > directive only 1`] = `
2426
"/* eslint-disable */
2527
// @ts-nocheck
26-
// Generated by unplugin-vue-components
27-
// Read more: https://github.com/vuejs/core/pull/3399
2828
// biome-ignore lint: disable
2929
// oxlint-disable
30+
// ------
31+
// Generated by unplugin-vue-components
32+
// Read more: https://github.com/vuejs/core/pull/3399
33+
3034
export {}
3135
3236
/* prettier-ignore */
@@ -41,10 +45,12 @@ declare module 'vue' {
4145
exports[`dts > generate components with prefix 1`] = `
4246
"/* eslint-disable */
4347
// @ts-nocheck
44-
// Generated by unplugin-vue-components
45-
// Read more: https://github.com/vuejs/core/pull/3399
4648
// biome-ignore lint: disable
4749
// oxlint-disable
50+
// ------
51+
// Generated by unplugin-vue-components
52+
// Read more: https://github.com/vuejs/core/pull/3399
53+
4854
export {}
4955
5056
/* prettier-ignore */
@@ -78,10 +84,12 @@ declare module 'vue' {
7884
exports[`dts > getDeclaration 1`] = `
7985
"/* eslint-disable */
8086
// @ts-nocheck
81-
// Generated by unplugin-vue-components
82-
// Read more: https://github.com/vuejs/core/pull/3399
8387
// biome-ignore lint: disable
8488
// oxlint-disable
89+
// ------
90+
// Generated by unplugin-vue-components
91+
// Read more: https://github.com/vuejs/core/pull/3399
92+
8593
export {}
8694
8795
/* prettier-ignore */
@@ -135,13 +143,47 @@ exports[`dts > parseDeclaration 1`] = `
135143
}
136144
`;
137145

138-
exports[`dts > vue 2.7 components only 1`] = `
146+
exports[`dts > tsx 1`] = `
139147
"/* eslint-disable */
140148
// @ts-nocheck
149+
// biome-ignore lint: disable
150+
// oxlint-disable
151+
// ------
141152
// Generated by unplugin-vue-components
142153
// Read more: https://github.com/vuejs/core/pull/3399
154+
import { GlobalComponents } from 'vue'
155+
156+
export {}
157+
158+
/* prettier-ignore */
159+
declare module 'vue' {
160+
export interface GlobalComponents {
161+
RouterLink: typeof import('vue-router')['RouterLink']
162+
RouterView: typeof import('vue-router')['RouterView']
163+
TestComp: typeof import('test/component/TestComp')['default']
164+
}
165+
export interface GlobalDirectives {
166+
vLoading: typeof import('test/directive/Loading')['default']
167+
}
168+
}
169+
170+
// For TSX support
171+
declare global {
172+
const RouterLink: typeof import('vue-router')['RouterLink']
173+
const RouterView: typeof import('vue-router')['RouterView']
174+
const TestComp: typeof import('test/component/TestComp')['default']
175+
}"
176+
`;
177+
178+
exports[`dts > vue 2.7 components only 1`] = `
179+
"/* eslint-disable */
180+
// @ts-nocheck
143181
// biome-ignore lint: disable
144182
// oxlint-disable
183+
// ------
184+
// Generated by unplugin-vue-components
185+
// Read more: https://github.com/vuejs/core/pull/3399
186+
145187
export {}
146188
147189
/* prettier-ignore */
@@ -158,10 +200,12 @@ declare module 'vue' {
158200
exports[`dts > writeDeclaration - append 1`] = `
159201
"/* eslint-disable */
160202
// @ts-nocheck
161-
// Generated by unplugin-vue-components
162-
// Read more: https://github.com/vuejs/core/pull/3399
163203
// biome-ignore lint: disable
164204
// oxlint-disable
205+
// ------
206+
// Generated by unplugin-vue-components
207+
// Read more: https://github.com/vuejs/core/pull/3399
208+
165209
export {}
166210
167211
/* prettier-ignore */
@@ -184,10 +228,12 @@ declare module 'vue' {
184228
exports[`dts > writeDeclaration - overwrite 1`] = `
185229
"/* eslint-disable */
186230
// @ts-nocheck
187-
// Generated by unplugin-vue-components
188-
// Read more: https://github.com/vuejs/core/pull/3399
189231
// biome-ignore lint: disable
190232
// oxlint-disable
233+
// ------
234+
// Generated by unplugin-vue-components
235+
// Read more: https://github.com/vuejs/core/pull/3399
236+
191237
export {}
192238
193239
/* prettier-ignore */
@@ -207,10 +253,12 @@ declare module 'vue' {
207253
exports[`dts > writeDeclaration 1`] = `
208254
"/* eslint-disable */
209255
// @ts-nocheck
210-
// Generated by unplugin-vue-components
211-
// Read more: https://github.com/vuejs/core/pull/3399
212256
// biome-ignore lint: disable
213257
// oxlint-disable
258+
// ------
259+
// Generated by unplugin-vue-components
260+
// Read more: https://github.com/vuejs/core/pull/3399
261+
214262
export {}
215263
216264
/* prettier-ignore */

‎test/dts.test.ts‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,22 @@ const _directive_loading = _resolveDirective("loading")`
3232
expect(declarations).toMatchSnapshot()
3333
})
3434

35+
it('tsx', async () => {
36+
const ctx = new Context({
37+
resolvers: resolver,
38+
directives: true,
39+
dts: true,
40+
dtsTsx: true,
41+
})
42+
const code = `
43+
const _component_test_comp = _resolveComponent("test-comp")
44+
const _directive_loading = _resolveDirective("loading")`
45+
await ctx.transform(code, '')
46+
47+
const declarations = getDeclaration(ctx, 'test.d.ts')
48+
expect(declarations).toMatchSnapshot()
49+
})
50+
3551
it('writeDeclaration', async () => {
3652
const filepath = path.resolve(__dirname, 'tmp/dts-test.d.ts')
3753
const ctx = new Context({

0 commit comments

Comments
 (0)