@vue/language-core 3.0.0-beta.3 → 3.0.0-beta.5

package/lib/codegen/globalTypes.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getGlobalTypesFileName = getGlobalTypesFileName;
 exports.generateGlobalTypes = generateGlobalTypes;
+const shared_1 = require("../utils/shared");
 function getGlobalTypesFileName({ lib, target, checkUnknownProps, checkUnknownEvents, checkUnknownComponents, }) {
     return [
         lib,
@@ -28,15 +29,15 @@ function generateGlobalTypes({ lib, target, checkUnknownProps, checkUnknownEvent
 	const __VLS_placeholder: any;
 
 	type __VLS_NativeElements = __VLS_SpreadMerge<SVGElementTagNameMap, HTMLElementTagNameMap>;
-	type __VLS_IntrinsicElements = ${(target >= 3.3
+	type __VLS_IntrinsicElements = ${target >= 3.3
         ? `import('${lib}/jsx-runtime').JSX.IntrinsicElements;`
-        : `globalThis.JSX.IntrinsicElements;`)}
-	type __VLS_Element = ${(target >= 3.3
+        : `globalThis.JSX.IntrinsicElements;`}
+	type __VLS_Element = ${target >= 3.3
         ? `import('${lib}/jsx-runtime').JSX.Element;`
-        : `globalThis.JSX.Element;`)}
-	type __VLS_GlobalComponents = ${(target >= 3.5
+        : `globalThis.JSX.Element;`}
+	type __VLS_GlobalComponents = ${target >= 3.5
         ? `import('${lib}').GlobalComponents;`
-        : `import('${lib}').GlobalComponents & Pick<typeof import('${lib}'), 'Transition' | 'TransitionGroup' | 'KeepAlive' | 'Suspense' | 'Teleport'>;`)}
+        : `import('${lib}').GlobalComponents & Pick<typeof import('${lib}'), 'Transition' | 'TransitionGroup' | 'KeepAlive' | 'Suspense' | 'Teleport'>;`}
 	type __VLS_GlobalDirectives = import('${lib}').GlobalDirectives;
 	type __VLS_IsAny<T> = 0 extends 1 & T ? true : false;
 	type __VLS_PickNotAny<A, B> = __VLS_IsAny<A> extends true ? B : A;
@@ -61,7 +62,7 @@ function generateGlobalTypes({ lib, target, checkUnknownProps, checkUnknownEvent
 	type __VLS_FunctionalComponent<T> = (props: ${fnPropsType}, ctx?: any) => __VLS_Element & {
 		__ctx?: {
 			attrs?: any,
-			slots?: T extends { $slots: infer Slots } ? Slots : Record<string, any>,
+			slots?: T extends { ${(0, shared_1.getSlotsPropertyName)(target)}: infer Slots } ? Slots : Record<string, any>,
 			emit?: T extends { $emit: infer Emit } ? Emit : {},
 			props?: ${fnPropsType},
 			expose?: (exposed: T) => void,
@@ -117,7 +118,9 @@ function generateGlobalTypes({ lib, target, checkUnknownProps, checkUnknownEvent
 	type __VLS_ResolveEmits<
 		Comp,
 		Emits,
-		TypeEmits = ${target >= 3.6 ? `Comp extends { __typeEmits?: infer T } ? unknown extends T ? {} : import('${lib}').ShortEmitsToObject<T> : {}` : `{}`},
+		TypeEmits = ${target >= 3.6
+        ? `Comp extends { __typeEmits?: infer T } ? unknown extends T ? {} : import('${lib}').ShortEmitsToObject<T> : {}`
+        : `{}`},
 		NormalizedEmits = __VLS_NormalizeEmits<Emits> extends infer E ? string extends keyof E ? {} : E : never,
 	> = __VLS_SpreadMerge<NormalizedEmits, TypeEmits>;
 	type __VLS_ResolveDirectives<T> = {
@@ -149,7 +152,9 @@ function generateGlobalTypes({ lib, target, checkUnknownProps, checkUnknownEvent
 	function __VLS_makeOptional<T>(t: T): { [K in keyof T]?: T[K] };
 	function __VLS_asFunctionalComponent<T, K = T extends new (...args: any) => any ? InstanceType<T> : unknown>(t: T, instance?: K):
 		T extends new (...args: any) => any ? __VLS_FunctionalComponent<K>
-		: T extends () => any ? (props: {}, ctx?: any) => ReturnType<T>
+		: T extends () => any ? (props: {}, ctx?: any) => ReturnType<T>${target === 2.7
+        ? `: T extends import('${lib}').AsyncComponent ? (props: {}, ctx?: any) => any`
+        : ``}
 		: T extends (...args: any) => any ? T
 		: __VLS_FunctionalComponent<{}>;
 	function __VLS_functionalComponentArgsRest<T extends (...args: any) => any>(t: T): 2 extends Parameters<T>['length'] ? [any] : [];
@@ -160,5 +165,4 @@ function generateGlobalTypes({ lib, target, checkUnknownProps, checkUnknownEvent
 `;
     return text;
 }
-;
 //# sourceMappingURL=globalTypes.js.map

package/lib/codegen/localTypes.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getLocalTypesGenerator = getLocalTypesGenerator;
+const shared_1 = require("../utils/shared");
 const utils_1 = require("./utils");
 function getLocalTypesGenerator(vueCompilerOptions) {
     const used = new Set();
@@ -20,7 +21,7 @@ type __VLS_WithDefaults<P, D> = {
     const WithSlots = defineHelper(`__VLS_WithSlots`, () => `
 type __VLS_WithSlots<T, S> = T & {
 	new(): {
-		$slots: S;
+		${(0, shared_1.getSlotsPropertyName)(vueCompilerOptions.target)}: S;
 		${vueCompilerOptions.jsxSlots ? `$props: ${PropsChildren.name}<S>;` : ''}
 	}
 };
@@ -63,13 +64,27 @@ type __VLS_TypePropsToOption<T> = {
         getUsedNames() {
             return used;
         },
-        get PrettifyLocal() { return PrettifyLocal.name; },
-        get OmitKeepDiscriminatedUnion() { return OmitKeepDiscriminatedUnion.name; },
-        get WithDefaults() { return WithDefaults.name; },
-        get WithSlots() { return WithSlots.name; },
-        get PropsChildren() { return PropsChildren.name; },
-        get TypePropsToOption() { return TypePropsToOption.name; },
-        get OmitIndexSignature() { return OmitIndexSignature.name; },
+        get PrettifyLocal() {
+            return PrettifyLocal.name;
+        },
+        get OmitKeepDiscriminatedUnion() {
+            return OmitKeepDiscriminatedUnion.name;
+        },
+        get WithDefaults() {
+            return WithDefaults.name;
+        },
+        get WithSlots() {
+            return WithSlots.name;
+        },
+        get PropsChildren() {
+            return PropsChildren.name;
+        },
+        get TypePropsToOption() {
+            return TypePropsToOption.name;
+        },
+        get OmitIndexSignature() {
+            return OmitIndexSignature.name;
+        },
     };
     function* generate(names) {
         const generated = new Set();

package/lib/codegen/script/component.js

@@ -7,7 +7,8 @@ exports.generatePropsOption = generatePropsOption;
 const codeFeatures_1 = require("../codeFeatures");
 const utils_1 = require("../utils");
 function* generateComponent(options, ctx, scriptSetup, scriptSetupRanges) {
-    if (options.sfc.script && options.scriptRanges?.exportDefault && options.scriptRanges.exportDefault.expression.start !== options.scriptRanges.exportDefault.args.start) {
+    if (options.sfc.script && options.scriptRanges?.exportDefault
+        && options.scriptRanges.exportDefault.expression.start !== options.scriptRanges.exportDefault.args.start) {
         // use defineComponent() from user space code if it exist
         yield (0, utils_1.generateSfcBlockSection)(options.sfc.script, options.scriptRanges.exportDefault.expression.start, options.scriptRanges.exportDefault.args.start, codeFeatures_1.codeFeatures.all);
         yield `{${utils_1.newLine}`;

package/lib/codegen/script/index.js

@@ -36,7 +36,7 @@ function* generateScript(options) {
         yield* (0, scriptSetup_1.generateScriptSetupImports)(options.sfc.scriptSetup, options.scriptSetupRanges);
     }
     if (options.sfc.script && options.scriptRanges) {
-        const { exportDefault } = options.scriptRanges;
+        const { exportDefault, classBlockEnd } = options.scriptRanges;
         const isExportRawObject = exportDefault
             && options.sfc.script.content[exportDefault.expression.start] === '{';
         if (options.sfc.scriptSetup && options.scriptSetupRanges) {
@@ -77,6 +77,19 @@ function* generateScript(options) {
             yield options.vueCompilerOptions.optionsWrapper[1];
             yield (0, utils_1.generateSfcBlockSection)(options.sfc.script, exportDefault.expression.end, options.sfc.script.content.length, codeFeatures_1.codeFeatures.all);
         }
+        else if (classBlockEnd !== undefined) {
+            if (options.vueCompilerOptions.skipTemplateCodegen) {
+                yield (0, utils_1.generateSfcBlockSection)(options.sfc.script, 0, options.sfc.script.content.length, codeFeatures_1.codeFeatures.all);
+            }
+            else {
+                yield (0, utils_1.generateSfcBlockSection)(options.sfc.script, 0, classBlockEnd, codeFeatures_1.codeFeatures.all);
+                yield `__VLS_template = () => {${utils_1.newLine}`;
+                const templateCodegenCtx = yield* (0, template_1.generateTemplate)(options, ctx);
+                yield* (0, componentSelf_1.generateComponentSelf)(options, ctx, templateCodegenCtx);
+                yield `}${utils_1.endOfLine}`;
+                yield (0, utils_1.generateSfcBlockSection)(options.sfc.script, classBlockEnd, options.sfc.script.content.length, codeFeatures_1.codeFeatures.all);
+            }
+        }
         else {
             yield (0, utils_1.generateSfcBlockSection)(options.sfc.script, 0, options.sfc.script.content.length, codeFeatures_1.codeFeatures.all);
             yield* generateScriptSectionPartiallyEnding(options.sfc.script.name, options.sfc.script.content.length, '#3632/script.vue');

package/lib/codegen/script/scriptSetup.js

@@ -149,15 +149,17 @@ function* generateSetupFunction(options, ctx, scriptSetup, scriptSetupRanges, sy
             callExp.start,
             callExp.start,
         ], [
-            arg ? [
-                ` as Omit<__VLS_StyleModules, '$style'>[`,
-                (0, utils_1.generateSfcBlockSection)(scriptSetup, arg.start, arg.end, codeFeatures_1.codeFeatures.all),
-                `])`,
-            ] : [
-                ` as __VLS_StyleModules[`,
-                ...(0, wrapWith_1.wrapWith)(exp.start, exp.end, scriptSetup.name, codeFeatures_1.codeFeatures.verification, `'$style'`),
-                `])`,
-            ],
+            arg
+                ? [
+                    ` as Omit<__VLS_StyleModules, '$style'>[`,
+                    (0, utils_1.generateSfcBlockSection)(scriptSetup, arg.start, arg.end, codeFeatures_1.codeFeatures.all),
+                    `])`,
+                ]
+                : [
+                    ` as __VLS_StyleModules[`,
+                    ...(0, wrapWith_1.wrapWith)(exp.start, exp.end, scriptSetup.name, codeFeatures_1.codeFeatures.verification, `'$style'`),
+                    `])`,
+                ],
             callExp.end,
             callExp.end,
         ]);
@@ -277,11 +279,15 @@ function* generateMacros(options, ctx) {
 }
 function* generateDefineWithType(scriptSetup, statement, callExp, typeArg, name, defaultName, typeName) {
     if (typeArg) {
-        yield [[
+        yield [
+            [
                 `type ${typeName} = `,
                 (0, utils_1.generateSfcBlockSection)(scriptSetup, typeArg.start, typeArg.end, codeFeatures_1.codeFeatures.all),
                 utils_1.endOfLine,
-            ], statement.start, statement.start];
+            ],
+            statement.start,
+            statement.start,
+        ];
         yield [[typeName], typeArg.start, typeArg.end];
     }
     if (!name) {
@@ -289,25 +295,37 @@ function* generateDefineWithType(scriptSetup, statement, callExp, typeArg, name,
             yield [[`const ${defaultName} = `], callExp.start, callExp.start];
         }
         else if (typeArg) {
-            yield [[
+            yield [
+                [
                     `const ${defaultName} = `,
                     (0, utils_1.generateSfcBlockSection)(scriptSetup, callExp.start, typeArg.start, codeFeatures_1.codeFeatures.all),
-                ], statement.start, typeArg.start];
-            yield [[
+                ],
+                statement.start,
+                typeArg.start,
+            ];
+            yield [
+                [
                     (0, utils_1.generateSfcBlockSection)(scriptSetup, typeArg.end, callExp.end, codeFeatures_1.codeFeatures.all),
                     utils_1.endOfLine,
                     (0, utils_1.generateSfcBlockSection)(scriptSetup, statement.start, callExp.start, codeFeatures_1.codeFeatures.all),
                     defaultName,
-                ], typeArg.end, callExp.end];
+                ],
+                typeArg.end,
+                callExp.end,
+            ];
         }
         else {
-            yield [[
+            yield [
+                [
                     `const ${defaultName} = `,
                     (0, utils_1.generateSfcBlockSection)(scriptSetup, callExp.start, callExp.end, codeFeatures_1.codeFeatures.all),
                     utils_1.endOfLine,
                     (0, utils_1.generateSfcBlockSection)(scriptSetup, statement.start, callExp.start, codeFeatures_1.codeFeatures.all),
                     defaultName,
-                ], statement.start, callExp.end];
+                ],
+                statement.start,
+                callExp.end,
+            ];
         }
     }
 }
@@ -323,9 +341,11 @@ function* generateComponentProps(options, ctx, scriptSetup, scriptSetupRanges) {
         yield `})${utils_1.endOfLine}`;
         yield `type __VLS_BuiltInPublicProps = ${options.vueCompilerOptions.target >= 3.4
             ? `import('${options.vueCompilerOptions.lib}').PublicProps`
-            : `import('${options.vueCompilerOptions.lib}').VNodeProps`
-                + ` & import('${options.vueCompilerOptions.lib}').AllowedComponentProps`
-                + ` & import('${options.vueCompilerOptions.lib}').ComponentCustomProps`}`;
+            : options.vueCompilerOptions.target >= 3
+                ? `import('${options.vueCompilerOptions.lib}').VNodeProps`
+                    + ` & import('${options.vueCompilerOptions.lib}').AllowedComponentProps`
+                    + ` & import('${options.vueCompilerOptions.lib}').ComponentCustomProps`
+                : `globalThis.JSX.IntrinsicAttributes`}`;
         yield utils_1.endOfLine;
         yield `type __VLS_OwnProps = `;
         yield `${ctx.localTypes.OmitKeepDiscriminatedUnion}<InstanceType<typeof __VLS_fnComponent>['$props'], keyof __VLS_BuiltInPublicProps>`;
@@ -415,7 +435,7 @@ function* generateDefineModelType(scriptSetup, propName, localName, defineModel)
         yield getRangeText(scriptSetup, defineModel.type);
     }
     else if (defineModel.runtimeType && localName) {
-        // Infer from actual prop declaration code 
+        // Infer from actual prop declaration code
         yield `typeof ${localName}['value']`;
     }
     else if (defineModel.defaultValue && propName) {

package/lib/codegen/template/context.d.ts

@@ -100,7 +100,7 @@ export type TemplateCodegenContext = ReturnType<typeof createTemplateCodegenCont
  * an error/diagnostic was encountered for a region of code covered by a `@vue-expect-error` directive,
  * and additionally how we use that to determine whether to propagate diagnostics back upward.
  */
-export declare function createTemplateCodegenContext(options: Pick<TemplateCodegenOptions, 'scriptSetupBindingNames'>): {
+export declare function createTemplateCodegenContext(options: Pick<TemplateCodegenOptions, 'scriptSetupBindingNames'>, templateAst?: CompilerDOM.RootNode): {
     readonly currentInfo: {
         ignoreError?: boolean;
         expectError?: {
@@ -132,6 +132,7 @@ export declare function createTemplateCodegenContext(options: Pick<TemplateCodeg
         withoutSemantic: VueCodeInformation;
     };
     resolveCodeFeatures: (features: VueCodeInformation) => VueCodeInformation;
+    inlineTsAsts: Map<string, import("typescript").SourceFile> | undefined;
     inVFor: boolean;
     slots: {
         name: string;

package/lib/codegen/template/context.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createTemplateCodegenContext = createTemplateCodegenContext;
 const CompilerDOM = require("@vue/compiler-dom");
+const computedSfc_1 = require("../../virtualFile/computedSfc");
 const codeFeatures_1 = require("../codeFeatures");
 const utils_1 = require("../utils");
 const wrapWith_1 = require("../utils/wrapWith");
@@ -103,7 +104,7 @@ const commentDirectiveRegex = /^<!--\s*@vue-(?<name>[-\w]+)\b(?<content>[\s\S]*)
  * an error/diagnostic was encountered for a region of code covered by a `@vue-expect-error` directive,
  * and additionally how we use that to determine whether to propagate diagnostics back upward.
  */
-function createTemplateCodegenContext(options) {
+function createTemplateCodegenContext(options, templateAst) {
     let variableId = 0;
     function resolveCodeFeatures(features) {
         if (features.verification && stack.length) {
@@ -160,6 +161,7 @@ function createTemplateCodegenContext(options) {
             },
         }),
         resolveCodeFeatures,
+        inlineTsAsts: templateAst && computedSfc_1.templateInlineTsAsts.get(templateAst),
         inVFor: false,
         slots,
         dynamicSlots,

package/lib/codegen/template/element.js

@@ -101,7 +101,9 @@ function* generateComponent(options, ctx, node) {
     else if (!isComponentTag) {
         yield `const ${componentOriginalVar} = ({} as __VLS_WithComponent<'${getCanonicalComponentName(node.tag)}', __VLS_LocalComponents, `;
         if (options.selfComponentName && possibleOriginalNames.includes(options.selfComponentName)) {
-            yield `typeof __VLS_self & (new () => { $slots: __VLS_Slots }), `;
+            yield `typeof __VLS_self & (new () => { `
+                + (0, shared_2.getSlotsPropertyName)(options.vueCompilerOptions.target)
+                + `: __VLS_Slots }), `;
         }
         else {
             yield `void, `;
@@ -161,7 +163,8 @@ function* generateComponent(options, ctx, node) {
     yield* (0, elementDirectives_1.generateElementDirectives)(options, ctx, node);
     const [refName, offset] = yield* generateElementReference(options, ctx, node);
     const tag = (0, shared_2.hyphenateTag)(node.tag);
-    const isRootNode = ctx.singleRootNodes.has(node) && !options.vueCompilerOptions.fallthroughComponentNames.includes(tag);
+    const isRootNode = ctx.singleRootNodes.has(node)
+        && !options.vueCompilerOptions.fallthroughComponentNames.includes(tag);
     if (refName || isRootNode) {
         const componentInstanceVar = ctx.getInternalVariable();
         ctx.currentComponent.used = true;
@@ -179,7 +182,7 @@ function* generateComponent(options, ctx, node) {
     }
     if (hasVBindAttrs(options, ctx, node)) {
         const attrsVar = ctx.getInternalVariable();
-        yield `let ${attrsVar}!: Parameters<typeof ${componentFunctionalVar}>[0]${utils_1.endOfLine}`;
+        yield `var ${attrsVar}!: Parameters<typeof ${componentFunctionalVar}>[0]${utils_1.endOfLine}`;
         ctx.inheritedAttrVars.add(attrsVar);
     }
     (0, styleScopedClasses_1.collectStyleScopedClassReferences)(options, ctx, node);
@@ -190,7 +193,8 @@ function* generateComponent(options, ctx, node) {
     }
 }
 function* generateElement(options, ctx, node) {
-    const startTagOffset = node.loc.start.offset + options.template.content.slice(node.loc.start.offset).indexOf(node.tag);
+    const startTagOffset = node.loc.start.offset
+        + options.template.content.slice(node.loc.start.offset).indexOf(node.tag);
     const endTagOffset = !node.isSelfClosing && options.template.lang === 'html'
         ? node.loc.start.offset + node.loc.source.lastIndexOf(node.tag)
         : undefined;
@@ -289,8 +293,8 @@ function* generateElementReference(options, ctx, node) {
     return [];
 }
 function hasVBindAttrs(options, ctx, node) {
-    return options.vueCompilerOptions.fallthroughAttributes && ((options.inheritAttrs && ctx.singleRootNodes.has(node)) ||
-        node.props.some(prop => prop.type === CompilerDOM.NodeTypes.DIRECTIVE
+    return options.vueCompilerOptions.fallthroughAttributes && ((options.inheritAttrs && ctx.singleRootNodes.has(node))
+        || node.props.some(prop => prop.type === CompilerDOM.NodeTypes.DIRECTIVE
             && prop.name === 'bind'
             && prop.exp?.loc.source === '$attrs'));
 }

package/lib/codegen/template/elementEvents.js

@@ -86,7 +86,7 @@ function* generateEventExpression(options, ctx, prop) {
         let prefix = `(`;
         let suffix = `)`;
         let isFirstMapping = true;
-        const ast = (0, utils_1.createTsAst)(options.ts, options.template.ast, prop.exp.content);
+        const ast = (0, utils_1.createTsAst)(options.ts, ctx.inlineTsAsts, prop.exp.content);
         const isCompound = isCompoundExpression(options.ts, ast);
         if (isCompound) {
             ctx.addLocalVariable('$event');

package/lib/codegen/template/elementProps.js

@@ -111,7 +111,11 @@ function* generateElementProps(options, ctx, node, props, strictPropsCheck, enab
             }
         }
         else if (prop.type === CompilerDOM.NodeTypes.ATTRIBUTE) {
-            if (options.vueCompilerOptions.dataAttributes.some(pattern => (0, minimatch_1.minimatch)(prop.name, pattern))) {
+            if (options.vueCompilerOptions.dataAttributes.some(pattern => (0, minimatch_1.minimatch)(prop.name, pattern))
+                // Vue 2 Transition doesn't support "persisted" property but `@vue/compiler-dom` always adds it (#3881)
+                || (options.vueCompilerOptions.target < 3
+                    && prop.name === 'persisted'
+                    && node.tag.toLowerCase() === 'transition')) {
                 continue;
             }
             const shouldSpread = prop.name === 'style' || prop.name === 'class';
@@ -268,6 +272,6 @@ function getModelPropName(node, vueCompilerOptions) {
             }
         }
     }
-    return 'modelValue';
+    return vueCompilerOptions.target < 3 ? 'value' : 'modelValue';
 }
 //# sourceMappingURL=elementProps.js.map

package/lib/codegen/template/index.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.generateTemplate = generateTemplate;
 exports.forEachElementNode = forEachElementNode;
 const CompilerDOM = require("@vue/compiler-dom");
+const shared_1 = require("../../utils/shared");
 const utils_1 = require("../utils");
 const wrapWith_1 = require("../utils/wrapWith");
 const context_1 = require("./context");
@@ -10,15 +11,16 @@ const objectProperty_1 = require("./objectProperty");
 const styleScopedClasses_1 = require("./styleScopedClasses");
 const templateChild_1 = require("./templateChild");
 function* generateTemplate(options) {
-    const ctx = (0, context_1.createTemplateCodegenContext)(options);
+    const ctx = (0, context_1.createTemplateCodegenContext)(options, options.template.ast);
     if (options.slotsAssignName) {
         ctx.addLocalVariable(options.slotsAssignName);
     }
     if (options.propsAssignName) {
         ctx.addLocalVariable(options.propsAssignName);
     }
+    const slotsPropertyName = (0, shared_1.getSlotsPropertyName)(options.vueCompilerOptions.target);
     if (options.vueCompilerOptions.inferTemplateDollarSlots) {
-        ctx.dollarVars.add('$slots');
+        ctx.dollarVars.add(slotsPropertyName);
     }
     if (options.vueCompilerOptions.inferTemplateDollarAttrs) {
         ctx.dollarVars.add('$attrs');
@@ -35,7 +37,7 @@ function* generateTemplate(options) {
     yield* (0, styleScopedClasses_1.generateStyleScopedClassReferences)(ctx);
     yield* ctx.generateHoistVariables();
     const speicalTypes = [
-        ['$slots', yield* generateSlots(options, ctx)],
+        [slotsPropertyName, yield* generateSlots(options, ctx)],
         ['$attrs', yield* generateInheritedAttrs(options, ctx)],
         ['$refs', yield* generateTemplateRefs(options, ctx)],
         ['$el', yield* generateRootEl(ctx)],

package/lib/codegen/template/interpolation.js

@@ -8,8 +8,7 @@ const utils_1 = require("../utils");
 const isLiteralWhitelisted = /*@__PURE__*/ (0, shared_1.makeMap)('true,false,null,this');
 function* generateInterpolation(options, ctx, source, data, code, start, prefix = '', suffix = '') {
     const { ts, destructuredPropNames, templateRefNames, } = options;
-    const template = 'template' in options ? options.template : options.sfc.template;
-    for (let [section, offset, type] of forEachInterpolationSegment(ts, template, destructuredPropNames, templateRefNames, ctx, code, start, prefix, suffix)) {
+    for (let [section, offset, type] of forEachInterpolationSegment(ts, ctx.inlineTsAsts, destructuredPropNames, templateRefNames, ctx, code, start, prefix, suffix)) {
         if (offset === undefined) {
             yield section;
         }
@@ -36,7 +35,9 @@ function* generateInterpolation(options, ctx, source, data, code, start, prefix
                         start + offset,
                         type === 'errorMappingOnly'
                             ? ctx.codeFeatures.verification
-                            : typeof data === 'function' ? data(start + offset) : data,
+                            : typeof data === 'function'
+                                ? data(start + offset)
+                                : data,
                     ];
                 }
                 else {
@@ -47,8 +48,7 @@ function* generateInterpolation(options, ctx, source, data, code, start, prefix
         }
     }
 }
-;
-function* forEachInterpolationSegment(ts, template, destructuredPropNames, templateRefNames, ctx, originalCode, start, prefix, suffix) {
+function* forEachInterpolationSegment(ts, inlineTsAsts, destructuredPropNames, templateRefNames, ctx, originalCode, start, prefix, suffix) {
     const code = prefix + originalCode + suffix;
     const offset = start !== undefined ? start - prefix.length : undefined;
     let ctxVars = [];
@@ -59,7 +59,7 @@ function* forEachInterpolationSegment(ts, template, destructuredPropNames, templ
         });
     }
     else {
-        const ast = (0, utils_1.createTsAst)(ts, template?.ast, code);
+        const ast = (0, utils_1.createTsAst)(ts, inlineTsAsts, code);
         const varCb = (id, isShorthand) => {
             const text = (0, shared_2.getNodeText)(ts, id, ast);
             if (!shouldIdentifierSkipped(ctx, text, destructuredPropNames)) {
@@ -152,17 +152,14 @@ function walkIdentifiers(ts, node, ast, cb, ctx, blockVars = [], isRoot = true)
                     walkIdentifiers(ts, prop.name.expression, ast, cb, ctx, blockVars, false);
                 }
                 walkIdentifiers(ts, prop.initializer, ast, cb, ctx, blockVars, false);
-            }
-            // fix https://github.com/vuejs/language-tools/issues/1156
+            } // fix https://github.com/vuejs/language-tools/issues/1156
             else if (ts.isShorthandPropertyAssignment(prop)) {
                 walkIdentifiers(ts, prop, ast, cb, ctx, blockVars, false);
-            }
-            // fix https://github.com/vuejs/language-tools/issues/1148#issuecomment-1094378126
+            } // fix https://github.com/vuejs/language-tools/issues/1148#issuecomment-1094378126
             else if (ts.isSpreadAssignment(prop)) {
                 // TODO: cannot report "Spread types may only be created from object types.ts(2698)"
                 walkIdentifiers(ts, prop.expression, ast, cb, ctx, blockVars, false);
-            }
-            // fix https://github.com/vuejs/language-tools/issues/4604
+            } // fix https://github.com/vuejs/language-tools/issues/4604
             else if (ts.isFunctionLike(prop) && prop.body) {
                 processFunction(ts, prop, ast, cb, ctx);
             }

package/lib/codegen/template/slotOutlet.js

@@ -10,7 +10,8 @@ const elementProps_1 = require("./elementProps");
 const interpolation_1 = require("./interpolation");
 const propertyAccess_1 = require("./propertyAccess");
 function* generateSlotOutlet(options, ctx, node) {
-    const startTagOffset = node.loc.start.offset + options.template.content.slice(node.loc.start.offset).indexOf(node.tag);
+    const startTagOffset = node.loc.start.offset
+        + options.template.content.slice(node.loc.start.offset).indexOf(node.tag);
     const startTagEndOffset = startTagOffset + node.tag.length;
     const propsVar = ctx.getInternalVariable();
     const nameProp = node.props.find(prop => {

package/lib/codegen/template/styleScopedClasses.js

@@ -67,8 +67,8 @@ function collectStyleScopedClassReferences(options, ctx, node) {
             const ast = ts.createSourceFile('', content, 99);
             const literals = [];
             ts.forEachChild(ast, node => {
-                if (!ts.isExpressionStatement(node) ||
-                    !isTemplateExpression(node.expression)) {
+                if (!ts.isExpressionStatement(node)
+                    || !isTemplateExpression(node.expression)) {
                     return;
                 }
                 const expression = node.expression.templateSpans[0].expression;

package/lib/codegen/template/templateChild.js

@@ -173,7 +173,8 @@ function parseInterpolationNode(node, template) {
         start--;
         content = leftCharacter + content;
     }
-    while ((rightCharacter = template.slice(start + content.length, start + content.length + 1)).trim() === '' && rightCharacter.length) {
+    while ((rightCharacter = template.slice(start + content.length, start + content.length + 1)).trim() === ''
+        && rightCharacter.length) {
         content = content + rightCharacter;
     }
     return [

package/lib/codegen/template/vFor.js

@@ -12,7 +12,7 @@ function* generateVFor(options, ctx, node) {
     const forBlockVars = [];
     yield `for (const [`;
     if (leftExpressionRange && leftExpressionText) {
-        const collectAst = (0, utils_1.createTsAst)(options.ts, options.template.ast, `const [${leftExpressionText}]`);
+        const collectAst = (0, utils_1.createTsAst)(options.ts, ctx.inlineTsAsts, `const [${leftExpressionText}]`);
         (0, utils_1.collectVars)(options.ts, collectAst, collectAst, forBlockVars);
         yield [
             leftExpressionText,

package/lib/codegen/template/vSlot.js

@@ -35,7 +35,7 @@ function* generateVSlot(options, ctx, node, slotDir) {
         yield `: ${slotVar} } = ${ctx.currentComponent.ctxVar}.slots!${utils_1.endOfLine}`;
     }
     if (slotDir?.exp?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION) {
-        const slotAst = (0, utils_1.createTsAst)(options.ts, options.template.ast, `(${slotDir.exp.content}) => {}`);
+        const slotAst = (0, utils_1.createTsAst)(options.ts, ctx.inlineTsAsts, `(${slotDir.exp.content}) => {}`);
         (0, utils_1.collectVars)(options.ts, slotAst, slotAst, slotBlockVars);
         yield* generateSlotParameters(options, ctx, slotAst, slotDir.exp, slotVar);
     }

package/lib/codegen/utils/escaped.d.ts

@@ -1,2 +1,2 @@
-import type { Code, VueCodeInformation } from "../../types";
+import type { Code, VueCodeInformation } from '../../types';
 export declare function generateEscaped(text: string, source: string, offset: number, features: VueCodeInformation, escapeTarget: RegExp): Generator<Code>;

package/lib/codegen/utils/index.d.ts

@@ -16,5 +16,5 @@ export declare function collectIdentifiers(ts: typeof import('typescript'), node
     initializer: ts.Expression | undefined;
 }[];
 export declare function normalizeAttributeValue(node: CompilerDOM.TextNode): [string, number];
-export declare function createTsAst(ts: typeof import('typescript'), templateAst: CompilerDOM.RootNode | undefined, text: string): ts.SourceFile;
+export declare function createTsAst(ts: typeof import('typescript'), inlineTsAsts: Map<string, ts.SourceFile> | undefined, text: string): ts.SourceFile;
 export declare function generateSfcBlockSection(block: SfcBlock, start: number, end: number, features: VueCodeInformation): Code;

package/lib/codegen/utils/index.js

@@ -49,8 +49,7 @@ function normalizeAttributeValue(node) {
     }
     return [content, offset];
 }
-function createTsAst(ts, templateAst, text) {
-    const inlineTsAsts = templateAst?.__volar_inlineTsAsts;
+function createTsAst(ts, inlineTsAsts, text) {
     let ast = inlineTsAsts?.get(text);
     if (!ast) {
         ast = ts.createSourceFile('/a.ts', text, 99);

package/lib/codegen/utils/wrapWith.d.ts

@@ -1,3 +1,3 @@
-import type { Code, VueCodeInformation } from "../../types";
+import type { Code, VueCodeInformation } from '../../types';
 export declare function wrapWith(startOffset: number, endOffset: number, features: VueCodeInformation, ...codes: Code[]): Generator<Code>;
 export declare function wrapWith(startOffset: number, endOffset: number, source: string, features: VueCodeInformation, ...codes: Code[]): Generator<Code>;

package/lib/languagePlugin.js

@@ -6,6 +6,7 @@ exports.getAllExtensions = getAllExtensions;
 const language_core_1 = require("@volar/language-core");
 const CompilerDOM = require("@vue/compiler-dom");
 const plugins_1 = require("./plugins");
+const CompilerVue2 = require("./utils/vue2TemplateCompiler");
 const vueFile_1 = require("./virtualFile/vueFile");
 const fileRegistries = [];
 function getVueFileRegistry(key, plugins) {
@@ -37,7 +38,12 @@ function getFileRegistryKey(compilerOptions, vueCompilerOptions, plugins) {
 function createVueLanguagePlugin(ts, compilerOptions, vueCompilerOptions, asFileName) {
     const pluginContext = {
         modules: {
-            '@vue/compiler-dom': CompilerDOM,
+            '@vue/compiler-dom': vueCompilerOptions.target < 3
+                ? {
+                    ...CompilerDOM,
+                    compile: CompilerVue2.compile,
+                }
+                : CompilerDOM,
             typescript: ts,
         },
         compilerOptions,
@@ -88,9 +94,12 @@ function createVueLanguagePlugin(ts, compilerOptions, vueCompilerOptions, asFile
                         return {
                             code,
                             extension: '.' + lang,
-                            scriptKind: lang === 'js' ? ts.ScriptKind.JS
-                                : lang === 'jsx' ? ts.ScriptKind.JSX
-                                    : lang === 'tsx' ? ts.ScriptKind.TSX
+                            scriptKind: lang === 'js'
+                                ? ts.ScriptKind.JS
+                                : lang === 'jsx'
+                                    ? ts.ScriptKind.JSX
+                                    : lang === 'tsx'
+                                        ? ts.ScriptKind.TSX
                                         : ts.ScriptKind.TS,
                         };
                     }

package/lib/parsers/scriptRanges.d.ts

@@ -13,6 +13,7 @@ export declare function parseScriptRanges(ts: typeof import('typescript'), ast:
         nameOption: TextRange | undefined;
         inheritAttrsOption: string | undefined;
     }) | undefined;
+    classBlockEnd: number | undefined;
     bindings: {
         range: TextRange;
         moduleName?: string;