unjs / mkdist

Lightweight file-to-file transpiler.
MIT License
357 stars 25 forks source link

feat(vue): refactor vue loader with vue/compiler-sfc #251

Open Teages opened 1 week ago

Teages commented 1 week ago

Refactor the vue loader with vue/compiler-sfc.

Resolve #209 #249 #243 #14 #15 Close #210

Some break changes:

But I think it is worth.

also updated test.


It is a draft pull request because I found some times vue-tsc^2.1.0 will add the vue global declare in dts output for no resaon.

It happens in my own package Teages/mkdist-vue-loader but after I merged back to mkdist it disappeared....

fixed with https://github.com/unjs/mkdist/pull/251/commits/31e93f077e31fa32ba3caa3081cc4d321a4abc78

tested with https://github.com/unjs/mkdist/pull/251/commits/2452db9dda81d00dd61214f1ad8592959b6c4f6d

Example ```ts import type { Data } from './type'; export interface PropsData { name: string; data: Data; } declare const _default: import("vue").DefineComponent>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>; export default _default; type __VLS_NonUndefinedable = T extends undefined ? never : T; type __VLS_TypePropsToOption = { [K in keyof T]-?: {} extends Pick ? { type: import('vue').PropType<__VLS_NonUndefinedable>; } : { type: import('vue').PropType; required: true; }; }; declare module 'vue' { interface GlobalComponents { } interface GlobalDirectives { } } declare global { const __VLS_intrinsicElements: __VLS_IntrinsicElements; const __VLS_directiveBindingRestFields: { instance: null; oldValue: null; modifiers: any; dir: any; }; const __VLS_unref: typeof import('vue').unref; const __VLS_nativeElements: { a: HTMLAnchorElement; abbr: HTMLElement; address: HTMLElement; area: HTMLAreaElement; article: HTMLElement; aside: HTMLElement; audio: HTMLAudioElement; b: HTMLElement; base: HTMLBaseElement; bdi: HTMLElement; bdo: HTMLElement; blockquote: HTMLQuoteElement; body: HTMLBodyElement; br: HTMLBRElement; button: HTMLButtonElement; canvas: HTMLCanvasElement; caption: HTMLTableCaptionElement; cite: HTMLElement; code: HTMLElement; col: HTMLTableColElement; colgroup: HTMLTableColElement; data: HTMLDataElement; datalist: HTMLDataListElement; dd: HTMLElement; del: HTMLModElement; details: HTMLDetailsElement; dfn: HTMLElement; dialog: HTMLDialogElement; div: HTMLDivElement; dl: HTMLDListElement; dt: HTMLElement; em: HTMLElement; embed: HTMLEmbedElement; fieldset: HTMLFieldSetElement; figcaption: HTMLElement; figure: HTMLElement; footer: HTMLElement; form: HTMLFormElement; h1: HTMLHeadingElement; h2: HTMLHeadingElement; h3: HTMLHeadingElement; h4: HTMLHeadingElement; h5: HTMLHeadingElement; h6: HTMLHeadingElement; head: HTMLHeadElement; header: HTMLElement; hgroup: HTMLElement; hr: HTMLHRElement; html: HTMLHtmlElement; i: HTMLElement; iframe: HTMLIFrameElement; img: HTMLImageElement; input: HTMLInputElement; ins: HTMLModElement; kbd: HTMLElement; label: HTMLLabelElement; legend: HTMLLegendElement; li: HTMLLIElement; link: HTMLLinkElement; main: HTMLElement; map: HTMLMapElement; mark: HTMLElement; menu: HTMLMenuElement; meta: HTMLMetaElement; meter: HTMLMeterElement; nav: HTMLElement; noscript: HTMLElement; object: HTMLObjectElement; ol: HTMLOListElement; optgroup: HTMLOptGroupElement; option: HTMLOptionElement; output: HTMLOutputElement; p: HTMLParagraphElement; picture: HTMLPictureElement; pre: HTMLPreElement; progress: HTMLProgressElement; q: HTMLQuoteElement; rp: HTMLElement; rt: HTMLElement; ruby: HTMLElement; s: HTMLElement; samp: HTMLElement; script: HTMLScriptElement; search: HTMLElement; section: HTMLElement; select: HTMLSelectElement; slot: HTMLSlotElement; small: HTMLElement; source: HTMLSourceElement; span: HTMLSpanElement; strong: HTMLElement; style: HTMLStyleElement; sub: HTMLElement; summary: HTMLElement; sup: HTMLElement; table: HTMLTableElement; tbody: HTMLTableSectionElement; td: HTMLTableCellElement; template: HTMLTemplateElement; textarea: HTMLTextAreaElement; tfoot: HTMLTableSectionElement; th: HTMLTableCellElement; thead: HTMLTableSectionElement; time: HTMLTimeElement; title: HTMLTitleElement; tr: HTMLTableRowElement; track: HTMLTrackElement; u: HTMLElement; ul: HTMLUListElement; var: HTMLElement; video: HTMLVideoElement; wbr: HTMLElement; animate: SVGAnimateElement; animateMotion: SVGAnimateMotionElement; animateTransform: SVGAnimateTransformElement; circle: SVGCircleElement; clipPath: SVGClipPathElement; defs: SVGDefsElement; desc: SVGDescElement; ellipse: SVGEllipseElement; feBlend: SVGFEBlendElement; feColorMatrix: SVGFEColorMatrixElement; feComponentTransfer: SVGFEComponentTransferElement; feComposite: SVGFECompositeElement; feConvolveMatrix: SVGFEConvolveMatrixElement; feDiffuseLighting: SVGFEDiffuseLightingElement; feDisplacementMap: SVGFEDisplacementMapElement; feDistantLight: SVGFEDistantLightElement; feDropShadow: SVGFEDropShadowElement; feFlood: SVGFEFloodElement; feFuncA: SVGFEFuncAElement; feFuncB: SVGFEFuncBElement; feFuncG: SVGFEFuncGElement; feFuncR: SVGFEFuncRElement; feGaussianBlur: SVGFEGaussianBlurElement; feImage: SVGFEImageElement; feMerge: SVGFEMergeElement; feMergeNode: SVGFEMergeNodeElement; feMorphology: SVGFEMorphologyElement; feOffset: SVGFEOffsetElement; fePointLight: SVGFEPointLightElement; feSpecularLighting: SVGFESpecularLightingElement; feSpotLight: SVGFESpotLightElement; feTile: SVGFETileElement; feTurbulence: SVGFETurbulenceElement; filter: SVGFilterElement; foreignObject: SVGForeignObjectElement; g: SVGGElement; image: SVGImageElement; line: SVGLineElement; linearGradient: SVGLinearGradientElement; marker: SVGMarkerElement; mask: SVGMaskElement; metadata: SVGMetadataElement; mpath: SVGMPathElement; path: SVGPathElement; pattern: SVGPatternElement; polygon: SVGPolygonElement; polyline: SVGPolylineElement; radialGradient: SVGRadialGradientElement; rect: SVGRectElement; set: SVGSetElement; stop: SVGStopElement; svg: SVGSVGElement; switch: SVGSwitchElement; symbol: SVGSymbolElement; text: SVGTextElement; textPath: SVGTextPathElement; tspan: SVGTSpanElement; use: SVGUseElement; view: SVGViewElement; }; type __VLS_IntrinsicElements = import('vue/jsx-runtime').JSX.IntrinsicElements; type __VLS_Element = import('vue/jsx-runtime').JSX.Element; type __VLS_GlobalComponents = import('vue').GlobalComponents & Pick; type __VLS_GlobalDirectives = import('vue').GlobalDirectives; type __VLS_IsAny = 0 extends 1 & T ? true : false; type __VLS_PickNotAny = __VLS_IsAny extends true ? B : A; type __VLS_unknownDirective = (arg1: unknown, arg2: unknown, arg3: unknown, arg4: unknown) => void; type __VLS_WithComponent = N1 extends keyof LocalComponents ? N1 extends N0 ? Pick : { [K in N0]: LocalComponents[N1]; } : N2 extends keyof LocalComponents ? N2 extends N0 ? Pick : { [K in N0]: LocalComponents[N2]; } : N3 extends keyof LocalComponents ? N3 extends N0 ? Pick : { [K in N0]: LocalComponents[N3]; } : N1 extends keyof __VLS_GlobalComponents ? N1 extends N0 ? Pick<__VLS_GlobalComponents, N0 extends keyof __VLS_GlobalComponents ? N0 : never> : { [K in N0]: __VLS_GlobalComponents[N1]; } : N2 extends keyof __VLS_GlobalComponents ? N2 extends N0 ? Pick<__VLS_GlobalComponents, N0 extends keyof __VLS_GlobalComponents ? N0 : never> : { [K in N0]: __VLS_GlobalComponents[N2]; } : N3 extends keyof __VLS_GlobalComponents ? N3 extends N0 ? Pick<__VLS_GlobalComponents, N0 extends keyof __VLS_GlobalComponents ? N0 : never> : { [K in N0]: __VLS_GlobalComponents[N3]; } : { [K in N0]: unknown; }; type __VLS_FunctionalComponentProps = '__ctx' extends keyof __VLS_PickNotAny ? K extends { __ctx?: { props?: infer P; }; } ? NonNullable

: never : T extends (props: infer P, ...args: any) => any ? P : {}; type __VLS_IsFunction = K extends keyof T ? __VLS_IsAny extends false ? unknown extends T[K] ? false : true : false : false; type __VLS_UnionToIntersection = (U extends unknown ? (arg: U) => unknown : never) extends ((arg: infer P) => unknown) ? P : never; type __VLS_OverloadUnionInner = U & T extends (...args: infer A) => infer R ? U extends T ? never : __VLS_OverloadUnionInner & U & ((...args: A) => R)> | ((...args: A) => R) : never; type __VLS_OverloadUnion = Exclude<__VLS_OverloadUnionInner<(() => never) & T>, T extends () => never ? never : () => never>; type __VLS_ConstructorOverloads = __VLS_OverloadUnion extends infer F ? F extends (event: infer E, ...args: infer A) => any ? { [K in E & string]: (...args: A) => void; } : never : never; type __VLS_NormalizeEmits = __VLS_PrettifyGlobal<__VLS_UnionToIntersection<__VLS_ConstructorOverloads & { [K in keyof T]: T[K] extends any[] ? { (...args: T[K]): void; } : never; }>>; type __VLS_PrettifyGlobal = { [K in keyof T]: T[K]; } & {}; function __VLS_getVForSourceType(source: number): [number, number, number][]; function __VLS_getVForSourceType(source: string): [string, number, number][]; function __VLS_getVForSourceType(source: T): [ item: T[number], key: number, index: number ][]; function __VLS_getVForSourceType; }>(source: T): [ item: T extends { [Symbol.iterator](): Iterator; } ? T1 : never, key: number, index: undefined ][]; function __VLS_getVForSourceType; }>(source: T): [ item: number | (Exclude extends { [Symbol.iterator](): Iterator; } ? T1 : never), key: number, index: undefined ][]; function __VLS_getVForSourceType(source: T): [ item: T[keyof T], key: keyof T, index: number ][]; function __VLS_getSlotParams(slot: T): Parameters<__VLS_PickNotAny, (...args: any[]) => any>>; function __VLS_getSlotParam(slot: T): Parameters<__VLS_PickNotAny, (...args: any[]) => any>>[0]; function __VLS_directiveAsFunction(dir: T): T extends (...args: any) => any ? T | __VLS_unknownDirective : NonNullable<(T & Record)['created' | 'beforeMount' | 'mounted' | 'beforeUpdate' | 'updated' | 'beforeUnmount' | 'unmounted']>; function __VLS_withScope(ctx: T, scope: K): ctx is T & K; function __VLS_makeOptional(t: T): { [K in keyof T]?: T[K]; }; function __VLS_nonNullable(t: T): T extends null | undefined ? never : T; function __VLS_asFunctionalComponent any ? InstanceType : unknown>(t: T, instance?: K): T extends new (...args: any) => any ? (props: (K extends { $props: infer Props; } ? Props : any) & Record, ctx?: any) => __VLS_Element & { __ctx?: { attrs?: any; slots?: K extends { $slots: infer Slots; } ? Slots : any; emit?: K extends { $emit: infer Emit; } ? Emit : any; } & { props?: (K extends { $props: infer Props; } ? Props : any) & Record; expose?(exposed: K): void; }; } : T extends () => any ? (props: {}, ctx?: any) => ReturnType : T extends (...args: any) => any ? T : (_: {} & Record, ctx?: any) => { __ctx?: { attrs?: any; expose?: any; slots?: any; emit?: any; props?: {} & Record; }; }; function __VLS_elementAsFunction(tag: T, endTag?: T): (_: T & Record) => void; function __VLS_functionalComponentArgsRest any>(t: T): 2 extends Parameters['length'] ? [any] : []; function __VLS_pickFunctionalComponentCtx(comp: T, compInstance: K): NonNullable<__VLS_PickNotAny<'__ctx' extends keyof __VLS_PickNotAny ? K extends { __ctx?: infer Ctx; } ? Ctx : never : any, T extends (props: any, ctx: infer Ctx) => any ? Ctx : any>>; function __VLS_normalizeSlot(s: S): S extends () => infer R ? (props: {}) => R : S; function __VLS_tryAsConstant(t: T): T; } ```

codecov[bot] commented 1 week ago

Codecov Report

Attention: Patch coverage is 88.75740% with 19 lines in your changes missing coverage. Please review.

Project coverage is 80.69%. Comparing base (9000888) to head (31e93f0). Report is 57 commits behind head on main.

Files with missing lines Patch % Lines
src/loaders/vue.ts 87.58% 19 Missing :warning:
Additional details and impacted files ```diff @@ Coverage Diff @@ ## main #251 +/- ## ========================================== - Coverage 82.86% 80.69% -2.17% ========================================== Files 12 12 Lines 852 917 +65 Branches 133 189 +56 ========================================== + Hits 706 740 +34 - Misses 144 175 +31 Partials 2 2 ```

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.

Teages commented 1 week ago

according to tests in https://github.com/unjs/mkdist/pull/251/commits/2452db9dda81d00dd61214f1ad8592959b6c4f6d I think global declare pollution may be a configuration issue (and should not be handled in this pr), so I think this PR is ready for review.

now fixed