Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix(language-core): correct type inference of defineModel & defineEmits in generic #4823

Open
wants to merge 5 commits into
base: master
Choose a base branch
from
+157 −130
Open

fix(language-core): correct type inference of defineModel & defineEmits in generic #4823

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
60b24a3
fix: correct type inference of `defineModel` & `defineEmits` in generic
KazariEX Sep 7, 2024
d8d66c9
fix: redundant determine
KazariEX Sep 7, 2024
e89f3e0
Merge branch 'master' into fix/issue-4822
so1ve Sep 8, 2024
f82ac7d
refactor: reuse and simplify
KazariEX Sep 8, 2024
e040970
Merge branch 'fix/issue-4822' of https://github.com/KazariEX/vuejs-la…
KazariEX Sep 8, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 4 additions & 5 deletions packages/language-core/lib/codegen/script/component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ export function* generateComponent(
yield `}${endOfLine}`;
yield `},${newLine}`;
if (!ctx.bypassDefineComponent) {
const emitOptionCodes = [...generateEmitsOption(options, scriptSetup, scriptSetupRanges)];
const emitOptionCodes = [...generateEmitsOption(options, scriptSetupRanges)];
for (const code of emitOptionCodes) {
yield code;
}
Expand Down Expand Up @@ -64,7 +64,6 @@ export function* generateComponentSetupReturns(scriptSetupRanges: ScriptSetupRan

export function* generateEmitsOption(
options: ScriptCodegenOptions,
scriptSetup: NonNullable<Sfc['scriptSetup']>,
scriptSetupRanges: ScriptSetupRanges
): Generator<Code> {
const codes: {
Expand All @@ -75,16 +74,16 @@ export function* generateEmitsOption(
}[] = [];
if (scriptSetupRanges.defineProp.some(p => p.isModel)) {
codes.push({
optionExp: `{} as __VLS_NormalizeEmits<__VLS_ModelEmitsType>`,
typeOptionType: `__VLS_ModelEmitsType`,
optionExp: `{} as __VLS_NormalizeEmits<typeof __VLS_modelEmit>`,
typeOptionType: `__VLS_ModelEmit`,
});
}
if (scriptSetupRanges.emits.define) {
const { typeArg, hasUnionTypeArg } = scriptSetupRanges.emits.define;
codes.push({
optionExp: `{} as __VLS_NormalizeEmits<typeof ${scriptSetupRanges.emits.name ?? '__VLS_emit'}>`,
typeOptionType: typeArg && !hasUnionTypeArg
? scriptSetup.content.slice(typeArg.start, typeArg.end)
? `__VLS_Emit`
: undefined,
});
}
Expand Down
2 changes: 1 addition & 1 deletion packages/language-core/lib/codegen/script/componentSelf.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ export function* generateComponentSelf(
yield `}${endOfLine}`; // return {
yield `},${newLine}`; // setup() {
if (options.sfc.scriptSetup && options.scriptSetupRanges && !ctx.bypassDefineComponent) {
const emitOptionCodes = [...generateEmitsOption(options, options.sfc.scriptSetup, options.scriptSetupRanges)];
const emitOptionCodes = [...generateEmitsOption(options, options.scriptSetupRanges)];
for (const code of emitOptionCodes) {
yield code;
}
Expand Down
200 changes: 94 additions & 106 deletions packages/language-core/lib/codegen/script/scriptSetup.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ export function* generateScriptSetup(
emitTypes.push(`typeof ${scriptSetupRanges.emits.name ?? '__VLS_emit'}`);
}
if (scriptSetupRanges.defineProp.some(p => p.isModel)) {
emitTypes.push(`__VLS_ModelEmitsType`);
emitTypes.push(`typeof __VLS_modelEmit`);
}

yield ` return {} as {${newLine}`
Expand Down Expand Up @@ -130,45 +130,15 @@ function* generateSetupFunction(
ctx.scriptSetupGeneratedOffset = options.getGeneratedLength() - scriptSetupRanges.importSectionEndOffset;

let setupCodeModifies: [Code[], number, number][] = [];
const propsRange = scriptSetupRanges.props.withDefaults ?? scriptSetupRanges.props.define;
if (propsRange && scriptSetupRanges.props.define) {
const statement = scriptSetupRanges.props.define.statement;
if (scriptSetupRanges.props.define.typeArg) {
setupCodeModifies.push([[
`let __VLS_typeProps!: `,
generateSfcBlockSection(scriptSetup, scriptSetupRanges.props.define.typeArg.start, scriptSetupRanges.props.define.typeArg.end, codeFeatures.all),
endOfLine,
], statement.start, statement.start]);
setupCodeModifies.push([[`typeof __VLS_typeProps`], scriptSetupRanges.props.define.typeArg.start, scriptSetupRanges.props.define.typeArg.end]);
}
if (!scriptSetupRanges.props.name) {
if (statement.start === propsRange.start && statement.end === propsRange.end) {
setupCodeModifies.push([[`const __VLS_props = `], propsRange.start, propsRange.start]);
}
else {
if (scriptSetupRanges.props.define.typeArg) {
setupCodeModifies.push([[
`const __VLS_props = `,
generateSfcBlockSection(scriptSetup, propsRange.start, scriptSetupRanges.props.define.typeArg.start, codeFeatures.all),
], statement.start, scriptSetupRanges.props.define.typeArg.start]);
setupCodeModifies.push([[
generateSfcBlockSection(scriptSetup, scriptSetupRanges.props.define.typeArg.end, propsRange.end, codeFeatures.all),
`${endOfLine}`,
generateSfcBlockSection(scriptSetup, statement.start, propsRange.start, codeFeatures.all),
`__VLS_props`,
], scriptSetupRanges.props.define.typeArg.end, propsRange.end]);
}
else {
setupCodeModifies.push([[
`const __VLS_props = `,
generateSfcBlockSection(scriptSetup, propsRange.start, propsRange.end, codeFeatures.all),
`${endOfLine}`,
generateSfcBlockSection(scriptSetup, statement.start, propsRange.start, codeFeatures.all),
`__VLS_props`,
], statement.start, propsRange.end]);
}
}
}
if (scriptSetupRanges.props.define) {
setupCodeModifies.push(...generateDefineWithType(
scriptSetup,
scriptSetupRanges.props.name,
scriptSetupRanges.props.define,
scriptSetupRanges.props.withDefaults ?? scriptSetupRanges.props.define,
'__VLS_props',
'__VLS_Props'
));
}
if (scriptSetupRanges.slots.define) {
if (scriptSetupRanges.slots.isObjectBindingPattern) {
Expand All @@ -181,8 +151,15 @@ function* generateSetupFunction(
setupCodeModifies.push([[`const __VLS_slots = `], scriptSetupRanges.slots.define.start, scriptSetupRanges.slots.define.start]);
}
}
if (scriptSetupRanges.emits.define && !scriptSetupRanges.emits.name) {
setupCodeModifies.push([[`const __VLS_emit = `], scriptSetupRanges.emits.define.start, scriptSetupRanges.emits.define.start]);
if (scriptSetupRanges.emits.define) {
setupCodeModifies.push(...generateDefineWithType(
scriptSetup,
scriptSetupRanges.emits.name,
scriptSetupRanges.emits.define,
scriptSetupRanges.emits.define,
'__VLS_emit',
'__VLS_Emit'
));
}
if (scriptSetupRanges.expose.define) {
if (scriptSetupRanges.expose.define?.typeArg) {
Expand Down Expand Up @@ -217,30 +194,21 @@ function* generateSetupFunction(
}
if (scriptSetupRanges.cssModules.length) {
for (const { exp, arg } of scriptSetupRanges.cssModules) {
if (arg) {
setupCodeModifies.push([
[
` as Omit<__VLS_StyleModules, '$style'>[`,
generateSfcBlockSection(scriptSetup, arg.start, arg.end, codeFeatures.all),
`]`
],
exp.end,
exp.end
]);
}
else {
setupCodeModifies.push([
[
` as __VLS_StyleModules[`,
['', scriptSetup.name, exp.start, codeFeatures.verification],
`'$style'`,
['', scriptSetup.name, exp.end, codeFeatures.verification],
`]`
],
exp.end,
exp.end
]);
}
setupCodeModifies.push([
arg ? [
` as Omit<__VLS_StyleModules, '$style'>[`,
generateSfcBlockSection(scriptSetup, arg.start, arg.end, codeFeatures.all),
`]`
] : [
` as __VLS_StyleModules[`,
['', scriptSetup.name, exp.start, codeFeatures.verification],
`'$style'`,
['', scriptSetup.name, exp.end, codeFeatures.verification],
`]`
],
exp.end,
exp.end
]);
}
}
for (const { define } of scriptSetupRanges.templateRefs) {
Expand All @@ -258,25 +226,15 @@ function* generateSetupFunction(
}
setupCodeModifies = setupCodeModifies.sort((a, b) => a[1] - b[1]);

if (setupCodeModifies.length) {
yield generateSfcBlockSection(scriptSetup, scriptSetupRanges.importSectionEndOffset, setupCodeModifies[0][1], codeFeatures.all);
while (setupCodeModifies.length) {
const [codes, _start, end] = setupCodeModifies.shift()!;
for (const code of codes) {
yield code;
}
if (setupCodeModifies.length) {
const nextStart = setupCodeModifies[0][1];
yield generateSfcBlockSection(scriptSetup, end, nextStart, codeFeatures.all);
}
else {
yield generateSfcBlockSection(scriptSetup, end, scriptSetup.content.length, codeFeatures.all);
}
let nextStart = scriptSetupRanges.importSectionEndOffset;
for (const [codes, start, end] of setupCodeModifies) {
yield generateSfcBlockSection(scriptSetup, nextStart, start, codeFeatures.all);
for (const code of codes) {
yield code;
}
nextStart = end;
}
else {
yield generateSfcBlockSection(scriptSetup, scriptSetupRanges.importSectionEndOffset, scriptSetup.content.length, codeFeatures.all);
}
yield generateSfcBlockSection(scriptSetup, nextStart, scriptSetup.content.length, codeFeatures.all);

if (scriptSetupRanges.props.define?.typeArg && scriptSetupRanges.props.withDefaults?.arg) {
// fix https://github.com/vuejs/language-tools/issues/1187
Expand All @@ -286,7 +244,7 @@ function* generateSetupFunction(
}

yield* generateComponentProps(options, ctx, scriptSetup, scriptSetupRanges, definePropMirrors);
yield* generateModelEmits(options, scriptSetup, scriptSetupRanges);
yield* generateModelEmit(scriptSetup, scriptSetupRanges);
yield `function __VLS_template() {${newLine}`;
const templateCodegenCtx = yield* generateTemplate(options, ctx, false);
yield `}${endOfLine}`;
Expand All @@ -309,6 +267,47 @@ function* generateSetupFunction(
}
}

function* generateDefineWithType(
scriptSetup: NonNullable<Sfc['scriptSetup']>,
name: string | undefined,
define: {
statement: TextRange,
typeArg?: TextRange
},
expression: TextRange,
defaultName: string,
typeName: string
): Generator<[Code[], number, number]> {
const { statement, typeArg } = define;
if (typeArg) {
yield [[
`type ${typeName} = `,
generateSfcBlockSection(scriptSetup, typeArg.start, typeArg.end, codeFeatures.all),
endOfLine,
], statement.start, statement.start];
yield [[typeName], typeArg.start, typeArg.end];
}
if (!name) {
if (statement.start === expression.start && statement.end === expression.end) {
yield [[`const ${defaultName} = `], expression.start, expression.start];
}
else {
const typeArgStart = typeArg?.start ?? expression.end;
const typeArgEnd = typeArg?.end ?? expression.start;
yield [[
`const ${defaultName} = `,
generateSfcBlockSection(scriptSetup, expression.start, typeArgStart, codeFeatures.all)
], statement.start, typeArgStart];
yield [[
generateSfcBlockSection(scriptSetup, typeArgEnd, expression.end, codeFeatures.all),
endOfLine,
generateSfcBlockSection(scriptSetup, statement.start, expression.start, codeFeatures.all),
defaultName
], typeArgEnd, expression.end];
}
}
}

function* generateComponentProps(
options: ScriptCodegenOptions,
ctx: ScriptCodegenContext,
Expand All @@ -324,7 +323,7 @@ function* generateComponentProps(
yield `,${newLine}`;
}

yield* generateEmitsOption(options, scriptSetup, scriptSetupRanges);
yield* generateEmitsOption(options, scriptSetupRanges);

yield `})${endOfLine}`;

Expand Down Expand Up @@ -420,40 +419,29 @@ function* generateComponentProps(
yield ` & `;
}
ctx.generatedPropsType = true;
yield `typeof __VLS_typeProps`;
yield `__VLS_Props`;
}
if (!ctx.generatedPropsType) {
yield `{}`;
}
yield endOfLine;
}

function* generateModelEmits(
options: ScriptCodegenOptions,
function* generateModelEmit(
scriptSetup: NonNullable<Sfc['scriptSetup']>,
scriptSetupRanges: ScriptSetupRanges
): Generator<Code> {
const defineModels = scriptSetupRanges.defineProp.filter(p => p.isModel);
if (defineModels.length) {
const generateDefineModels = function* () {
for (const defineModel of defineModels) {
const [propName, localName] = getPropAndLocalName(scriptSetup, defineModel);
yield `'update:${propName}': [${propName}:`;
yield* generateDefinePropType(scriptSetup, propName, localName, defineModel);
yield `]${endOfLine}`;
}
};
if (options.vueCompilerOptions.target >= 3.5) {
yield `type __VLS_ModelEmitsType = {${newLine}`;
yield* generateDefineModels();
yield `}${endOfLine}`;
}
else {
yield `const __VLS_modelEmitsType = (await import('${options.vueCompilerOptions.lib}')).defineEmits<{${newLine}`;
yield* generateDefineModels();
yield `}>()${endOfLine}`;
yield `type __VLS_ModelEmitsType = typeof __VLS_modelEmitsType${endOfLine}`;
yield `type __VLS_ModelEmit = {${newLine}`;
for (const defineModel of defineModels) {
const [propName, localName] = getPropAndLocalName(scriptSetup, defineModel);
yield `'update:${propName}': [${propName}:`;
yield* generateDefinePropType(scriptSetup, propName, localName, defineModel);
yield `]${endOfLine}`;
}
yield `}${endOfLine}`;
yield `const __VLS_modelEmit = defineEmits<__VLS_ModelEmit>()${endOfLine}`;
}
}

Expand Down
48 changes: 30 additions & 18 deletions packages/language-core/lib/parsers/scriptSetupRanges.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ export function parseScriptSetupRanges(
const emits: {
name?: string;
define?: ReturnType<typeof parseDefineFunction> & {
statement: TextRange;
hasUnionTypeArg?: boolean;
};
} = {};
Expand Down Expand Up @@ -290,7 +291,10 @@ export function parseScriptSetupRanges(
}
}
else if (vueCompilerOptions.macros.defineEmits.includes(callText)) {
emits.define = parseDefineFunction(node);
emits.define = {
...parseDefineFunction(node),
statement: getStatementRange(ts, parents, node, ast)
};
if (ts.isVariableDeclaration(parent)) {
emits.name = getNodeText(ts, parent.name, ast);
}
Expand Down Expand Up @@ -326,25 +330,9 @@ export function parseScriptSetupRanges(
}
}

let statementRange: TextRange | undefined;
for (let i = parents.length - 1; i >= 0; i--) {
if (ts.isStatement(parents[i])) {
const statement = parents[i];
ts.forEachChild(statement, child => {
const range = _getStartEnd(child);
statementRange ??= range;
statementRange.end = range.end;
});
break;
}
}
if (!statementRange) {
statementRange = _getStartEnd(node);
}

props.define = {
...parseDefineFunction(node),
statement: statementRange,
statement: getStatementRange(ts, parents, node, ast),
};

if (node.arguments.length) {
Expand Down Expand Up @@ -518,3 +506,27 @@ export function getNodeText(
const { start, end } = getStartEnd(ts, node, sourceFile);
return sourceFile.text.substring(start, end);
}

function getStatementRange(
ts: typeof import('typescript'),
parents: ts.Node[],
node: ts.Node,
sourceFile: ts.SourceFile
) {
let statementRange: TextRange | undefined;
for (let i = parents.length - 1; i >= 0; i--) {
if (ts.isStatement(parents[i])) {
const statement = parents[i];
ts.forEachChild(statement, child => {
const range = getStartEnd(ts, child, sourceFile);
statementRange ??= range;
statementRange.end = range.end;
});
break;
}
}
if (!statementRange) {
statementRange = getStartEnd(ts, node, sourceFile);
}
return statementRange;
}
Loading