From fce47f0473942e882c0c1cbe1773a03437d5c3ef Mon Sep 17 00:00:00 2001 From: KazariEX <1364035137@qq.com> Date: Thu, 20 Feb 2025 01:51:18 +0800 Subject: [PATCH] refactor(language-core): simplify codegen of style class properties --- .../language-core/lib/codegen/script/index.ts | 4 -- .../lib/codegen/script/template.ts | 2 + .../lib/codegen/style/classProperty.ts | 15 ++----- .../lib/codegen/style/modules.ts | 9 ++-- .../lib/codegen/style/scopedClasses.ts | 45 ++++++++++--------- .../codegen/template/styleScopedClasses.ts | 27 +++++------ .../language-server/tests/renaming.spec.ts | 32 ++++++------- .../tsc/passedFixtures/vue3/#3688/main.vue | 2 +- .../tsc/passedFixtures/vue3/#4788/main.vue | 20 --------- 9 files changed, 59 insertions(+), 97 deletions(-) delete mode 100644 test-workspace/tsc/passedFixtures/vue3/#4788/main.vue diff --git a/packages/language-core/lib/codegen/script/index.ts b/packages/language-core/lib/codegen/script/index.ts index 13f98b11ac..fd38b1fc86 100644 --- a/packages/language-core/lib/codegen/script/index.ts +++ b/packages/language-core/lib/codegen/script/index.ts @@ -6,7 +6,6 @@ import type { ScriptSetupRanges } from '../../parsers/scriptSetupRanges'; import type { Code, Sfc, VueCompilerOptions } from '../../types'; import { codeFeatures } from '../codeFeatures'; import { generateGlobalTypes, getGlobalTypesFileName } from '../globalTypes'; -import { generateStyleModules } from '../style/modules'; import type { TemplateCodegenContext } from '../template/context'; import { endOfLine, generateSfcBlockSection, newLine } from '../utils'; import { generateComponentSelf } from './componentSelf'; @@ -134,9 +133,6 @@ export function* generateScript(options: ScriptCodegenOptions): Generator { yield* generateStyleScopedClasses(options, templateCodegenCtx); yield* generateStyleScopedClassReferences(templateCodegenCtx, true); + yield* generateStyleModules(options); yield* generateCssVars(options, templateCodegenCtx); if (options.templateCodegen) { diff --git a/packages/language-core/lib/codegen/style/classProperty.ts b/packages/language-core/lib/codegen/style/classProperty.ts index 0659cf4fca..8c7c51177d 100644 --- a/packages/language-core/lib/codegen/style/classProperty.ts +++ b/packages/language-core/lib/codegen/style/classProperty.ts @@ -6,30 +6,21 @@ export function* generateClassProperty( styleIndex: number, classNameWithDot: string, offset: number, - propertyType: string, - optional: boolean + propertyType: string ): Generator { - yield `${newLine} & { `; + yield `${newLine} & { '`; yield [ '', 'style_' + styleIndex, offset, codeFeatures.navigation, ]; - yield `'`; yield [ classNameWithDot.slice(1), 'style_' + styleIndex, offset + 1, codeFeatures.navigation, ]; - yield `'`; - yield [ - '', - 'style_' + styleIndex, - offset + classNameWithDot.length, - codeFeatures.navigationWithoutRename, - ]; - yield `${optional ? '?' : ''}: ${propertyType}`; + yield `': ${propertyType}`; yield ` }`; } diff --git a/packages/language-core/lib/codegen/style/modules.ts b/packages/language-core/lib/codegen/style/modules.ts index e0adc02b26..c2c343c3d4 100644 --- a/packages/language-core/lib/codegen/style/modules.ts +++ b/packages/language-core/lib/codegen/style/modules.ts @@ -1,13 +1,11 @@ import type { Code } from '../../types'; import { codeFeatures } from '../codeFeatures'; import type { ScriptCodegenOptions } from '../script'; -import type { ScriptCodegenContext } from '../script/context'; import { endOfLine, newLine } from '../utils'; import { generateClassProperty } from './classProperty'; export function* generateStyleModules( - options: ScriptCodegenOptions, - ctx: ScriptCodegenContext + options: ScriptCodegenOptions ): Generator { const styles = options.sfc.styles.map((style, i) => [style, i] as const).filter(([style]) => style.module); if (!styles.length && !options.scriptSetupRanges?.useCssModule.length) { @@ -27,14 +25,13 @@ export function* generateStyleModules( codeFeatures.withoutHighlight ]; } - yield `: Record & ${ctx.localTypes.PrettifyLocal}<{}`; + yield `: Record & __VLS_PrettifyGlobal<{}`; for (const className of style.classNames) { yield* generateClassProperty( i, className.text, className.offset, - 'string', - false + 'string' ); } yield `>${endOfLine}`; diff --git a/packages/language-core/lib/codegen/style/scopedClasses.ts b/packages/language-core/lib/codegen/style/scopedClasses.ts index 6ad946cc36..455ee25781 100644 --- a/packages/language-core/lib/codegen/style/scopedClasses.ts +++ b/packages/language-core/lib/codegen/style/scopedClasses.ts @@ -8,30 +8,33 @@ export function* generateStyleScopedClasses( options: ScriptCodegenOptions, ctx: TemplateCodegenContext ): Generator { + const option = options.vueCompilerOptions.experimentalResolveStyleCssClasses; + const styles = options.sfc.styles + .map((style, i) => [style, i] as const) + .filter(([style]) => option === 'always' || (option === 'scoped' && style.scoped)); + if (!styles.length) { + return; + } + const firstClasses = new Set(); yield `type __VLS_StyleScopedClasses = {}`; - for (let i = 0; i < options.sfc.styles.length; i++) { - const style = options.sfc.styles[i]; - const option = options.vueCompilerOptions.experimentalResolveStyleCssClasses; - if (option === 'always' || (option === 'scoped' && style.scoped)) { - for (const className of style.classNames) { - if (firstClasses.has(className.text)) { - ctx.scopedClasses.push({ - source: 'style_' + i, - className: className.text.slice(1), - offset: className.offset + 1 - }); - continue; - } - firstClasses.add(className.text); - yield* generateClassProperty( - i, - className.text, - className.offset, - 'boolean', - true - ); + for (const [style, i] of styles) { + for (const className of style.classNames) { + if (firstClasses.has(className.text)) { + ctx.scopedClasses.push({ + source: 'style_' + i, + className: className.text.slice(1), + offset: className.offset + 1 + }); + continue; } + firstClasses.add(className.text); + yield* generateClassProperty( + i, + className.text, + className.offset, + 'boolean' + ); } } yield endOfLine; diff --git a/packages/language-core/lib/codegen/template/styleScopedClasses.ts b/packages/language-core/lib/codegen/template/styleScopedClasses.ts index d7c2c1c7c2..a13ff70a02 100644 --- a/packages/language-core/lib/codegen/template/styleScopedClasses.ts +++ b/packages/language-core/lib/codegen/template/styleScopedClasses.ts @@ -21,25 +21,18 @@ export function* generateStyleScopedClassReferences( yield `']} */${endOfLine}`; } for (const { source, className, offset } of ctx.scopedClasses) { - yield `/** @type {__VLS_StyleScopedClasses[`; - yield [ - '', - source, - offset - (withDot ? 1 : 0), - ctx.codeFeatures.navigation, - ]; - yield `'`; - + yield `/** @type {__VLS_StyleScopedClasses['`; + if (withDot) { + yield [ + '', + source, + offset - 1, + ctx.codeFeatures.navigation, + ]; + } // fix https://github.com/vuejs/language-tools/issues/4537 yield* escapeString(source, className, offset, ['\\', '\'']); - yield `'`; - yield [ - '', - source, - offset + className.length, - ctx.codeFeatures.navigationWithoutRename, - ]; - yield `]} */${endOfLine}`; + yield `']} */${endOfLine}`; } function* escapeString(source: string, className: string, offset: number, escapeTargets: string[]): Generator { diff --git a/packages/language-server/tests/renaming.spec.ts b/packages/language-server/tests/renaming.spec.ts index 09cc6cf7c4..1a81801da8 100644 --- a/packages/language-server/tests/renaming.spec.ts +++ b/packages/language-server/tests/renaming.spec.ts @@ -104,12 +104,12 @@ describe('Renaming', async () => { "newText": "bar", "range": { "end": { - "character": 8, - "line": 7, + "character": 28, + "line": 2, }, "start": { - "character": 5, - "line": 7, + "character": 25, + "line": 2, }, }, }, @@ -117,12 +117,12 @@ describe('Renaming', async () => { "newText": "bar", "range": { "end": { - "character": 28, - "line": 2, + "character": 8, + "line": 7, }, "start": { - "character": 25, - "line": 2, + "character": 5, + "line": 7, }, }, }, @@ -743,12 +743,12 @@ describe('Renaming', async () => { "newText": "stylus", "range": { "end": { - "character": 23, - "line": 15, + "character": 22, + "line": 8, }, "start": { - "character": 19, - "line": 15, + "character": 18, + "line": 8, }, }, }, @@ -756,12 +756,12 @@ describe('Renaming', async () => { "newText": "stylus", "range": { "end": { - "character": 22, - "line": 8, + "character": 23, + "line": 15, }, "start": { - "character": 18, - "line": 8, + "character": 19, + "line": 15, }, }, }, diff --git a/test-workspace/tsc/passedFixtures/vue3/#3688/main.vue b/test-workspace/tsc/passedFixtures/vue3/#3688/main.vue index 41c9ffce24..91c3fa3c20 100644 --- a/test-workspace/tsc/passedFixtures/vue3/#3688/main.vue +++ b/test-workspace/tsc/passedFixtures/vue3/#3688/main.vue @@ -2,7 +2,7 @@ diff --git a/test-workspace/tsc/passedFixtures/vue3/#4788/main.vue b/test-workspace/tsc/passedFixtures/vue3/#4788/main.vue deleted file mode 100644 index fb7c084754..0000000000 --- a/test-workspace/tsc/passedFixtures/vue3/#4788/main.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - - -