From 6651dff8aee655f1a3f397e8c29f558fb30812e5 Mon Sep 17 00:00:00 2001 From: Johnson Chu Date: Thu, 31 Oct 2024 03:41:02 +0800 Subject: [PATCH 001/345] chore: update insiders.json --- insiders.json | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/insiders.json b/insiders.json index edc23dea70..b249afcfff 100644 --- a/insiders.json +++ b/insiders.json @@ -1,6 +1,14 @@ { - "latest": "2.1.9", + "latest": "2.1.11", "versions": [ + { + "version": "2.1.11", + "date": "2024-10-31", + "downloads": { + "GitHub": "https://github.com/volarjs/insiders/releases/tag/v2.1.11", + "AFDIAN": "https://afdian.com/p/c2e9365896f611ef9da75254001e7c00" + } + }, { "version": "2.1.9", "date": "2024-10-26", From 4c3c8c4242d789c5219bb4c59669ca4097b7168a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=B1=B1=E5=90=B9=E8=89=B2=E5=BE=A1=E5=AE=88?= <85992002+KazariEX@users.noreply.github.com> Date: Sat, 2 Nov 2024 16:33:44 +0800 Subject: [PATCH 002/345] feat(language-core): support `@vue-generic` (#4971) --- .../lib/codegen/template/context.ts | 5 ++++ .../lib/codegen/template/element.ts | 26 ++++++++++++++++++- .../lib/codegen/template/elementDirectives.ts | 1 + .../lib/codegen/template/templateChild.ts | 16 +++++++++--- .../lib/plugins/vue-template-inline-ts.ts | 14 +++++++++- .../lib/plugins/vue-directive-comments.ts | 17 +++++++----- .../tsc/passedFixtures/vue2/tsconfig.json | 1 + .../passedFixtures/vue3/v-generic/comp.vue | 5 ++++ .../passedFixtures/vue3/v-generic/main.vue | 17 ++++++++++++ 9 files changed, 90 insertions(+), 12 deletions(-) create mode 100644 test-workspace/tsc/passedFixtures/vue3/v-generic/comp.vue create mode 100644 test-workspace/tsc/passedFixtures/vue3/v-generic/main.vue diff --git a/packages/language-core/lib/codegen/template/context.ts b/packages/language-core/lib/codegen/template/context.ts index c5abab54e1..7334ae85a3 100644 --- a/packages/language-core/lib/codegen/template/context.ts +++ b/packages/language-core/lib/codegen/template/context.ts @@ -63,6 +63,10 @@ export function createTemplateCodegenContext(options: Pick { + if (ctx.lastGenericComment) { + const { content, offset } = ctx.lastGenericComment; + yield* wrapWith( + offset, + offset + content.length, + ctx.codeFeatures.verification, + `<`, + [ + content, + 'template', + offset, + ctx.codeFeatures.all + ], + `>` + ); + } + ctx.lastGenericComment = undefined; +} + function* generateComponentSlot( options: TemplateCodegenOptions, ctx: TemplateCodegenContext, diff --git a/packages/language-core/lib/codegen/template/elementDirectives.ts b/packages/language-core/lib/codegen/template/elementDirectives.ts index 3c67bce054..c8ebf4758a 100644 --- a/packages/language-core/lib/codegen/template/elementDirectives.ts +++ b/packages/language-core/lib/codegen/template/elementDirectives.ts @@ -24,6 +24,7 @@ export function* generateElementDirectives( || prop.name === 'bind' || prop.name === 'scope' || prop.name === 'data' + || prop.name === 'generic' ) { continue; } diff --git a/packages/language-core/lib/codegen/template/templateChild.ts b/packages/language-core/lib/codegen/template/templateChild.ts index c7df01b522..69be101239 100644 --- a/packages/language-core/lib/codegen/template/templateChild.ts +++ b/packages/language-core/lib/codegen/template/templateChild.ts @@ -36,16 +36,26 @@ export function* generateTemplateChild( ): Generator { if (prevNode?.type === CompilerDOM.NodeTypes.COMMENT) { const commentText = prevNode.content.trim().split(' ')[0]; - if (commentText.match(/^@vue-skip\b[\s\S]*/)) { + if (/^@vue-skip\b[\s\S]*/.test(commentText)) { yield `// @vue-skip${newLine}`; return; } - else if (commentText.match(/^@vue-ignore\b[\s\S]*/)) { + else if (/^@vue-ignore\b[\s\S]*/.test(commentText)) { yield* ctx.ignoreError(); } - else if (commentText.match(/^@vue-expect-error\b[\s\S]*/)) { + else if (/^@vue-expect-error\b[\s\S]*/.test(commentText)) { yield* ctx.expectError(prevNode); } + else { + const match = prevNode.loc.source.match(/^ + + + + + + + From 5f4c1e7ea7278907cc9dfce9a1a3c4ea076b3bb0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=B1=B1=E5=90=B9=E8=89=B2=E5=BE=A1=E5=AE=88?= <85992002+KazariEX@users.noreply.github.com> Date: Sat, 2 Nov 2024 17:48:01 +0800 Subject: [PATCH 003/345] refactor: improve code consistency (#4976) --- .vscode/settings.json | 3 + extensions/vscode/src/compatibility.ts | 4 +- extensions/vscode/src/hybridMode.ts | 4 +- extensions/vscode/src/languageClient.ts | 4 +- extensions/vscode/src/middleware.ts | 4 +- extensions/vscode/src/nodeClientMain.ts | 6 +- extensions/vscode/tests/grammar.spec.ts | 2 +- packages/component-meta/index.ts | 2 +- packages/component-meta/tests/index.spec.ts | 2 +- .../language-core/lib/codegen/localTypes.ts | 2 +- .../lib/codegen/script/component.ts | 2 +- .../lib/codegen/script/componentSelf.ts | 2 +- .../language-core/lib/codegen/script/index.ts | 2 +- .../lib/codegen/script/scriptSetup.ts | 30 ++-- .../language-core/lib/codegen/script/src.ts | 2 +- .../lib/codegen/script/styleModulesType.ts | 2 +- .../lib/codegen/script/template.ts | 13 +- .../lib/codegen/template/context.ts | 4 +- .../lib/codegen/template/element.ts | 91 +++++------ .../lib/codegen/template/elementChildren.ts | 2 +- .../lib/codegen/template/elementDirectives.ts | 6 +- .../lib/codegen/template/elementEvents.ts | 6 +- .../lib/codegen/template/elementProps.ts | 151 +++++++----------- .../lib/codegen/template/index.ts | 8 +- .../lib/codegen/template/interpolation.ts | 6 +- .../lib/codegen/template/objectProperty.ts | 10 +- .../lib/codegen/template/propertyAccess.ts | 4 +- .../lib/codegen/template/slotOutlet.ts | 4 +- .../codegen/template/styleScopedClasses.ts | 2 +- .../lib/codegen/template/templateChild.ts | 2 +- .../lib/codegen/template/vFor.ts | 2 +- .../language-core/lib/codegen/template/vIf.ts | 2 +- .../codegen/{template => utils}/camelized.ts | 2 +- .../lib/codegen/{common.ts => utils/index.ts} | 6 +- .../{template => utils}/stringLiteralKey.ts | 8 +- .../lib/codegen/utils/unicode.ts | 30 ++++ .../language-core/lib/parsers/scriptRanges.ts | 2 +- .../lib/parsers/scriptSetupRanges.ts | 4 +- .../lib/plugins/vue-template-inline-ts.ts | 4 +- .../language-core/lib/utils/buildMappings.ts | 2 +- .../lib/utils/findDestructuredProps.ts | 0 packages/language-core/lib/utils/parseSfc.ts | 2 +- packages/language-core/lib/utils/ts.ts | 6 +- packages/language-plugin-pug/index.ts | 2 +- packages/language-service/index.ts | 6 +- .../lib/plugins/vue-inlayhints.ts | 4 +- .../language-service/lib/plugins/vue-sfc.ts | 4 +- .../tsc/tests/__snapshots__/dts.spec.ts.snap | 8 +- packages/tsc/tests/dts.spec.ts | 6 +- packages/typescript-plugin/index.ts | 2 +- 50 files changed, 231 insertions(+), 253 deletions(-) rename packages/language-core/lib/codegen/{template => utils}/camelized.ts (92%) rename packages/language-core/lib/codegen/{common.ts => utils/index.ts} (93%) rename packages/language-core/lib/codegen/{template => utils}/stringLiteralKey.ts (79%) create mode 100644 packages/language-core/lib/codegen/utils/unicode.ts delete mode 100644 packages/language-core/lib/utils/findDestructuredProps.ts diff --git a/.vscode/settings.json b/.vscode/settings.json index da50bdc4ff..0efd9ce70d 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -2,6 +2,9 @@ "typescript.format.semicolons": "insert", "editor.insertSpaces": false, "editor.detectIndentation": false, + "editor.codeActionsOnSave": { + "source.organizeImports": "always" + }, "json.format.keepLines": true, "typescript.tsdk": "node_modules/typescript/lib", "[typescript]": { diff --git a/extensions/vscode/src/compatibility.ts b/extensions/vscode/src/compatibility.ts index 6bdecb770c..a0abe9aaac 100644 --- a/extensions/vscode/src/compatibility.ts +++ b/extensions/vscode/src/compatibility.ts @@ -1,6 +1,6 @@ -import * as vscode from 'vscode'; -import * as semver from 'semver'; import { computed, useAllExtensions } from 'reactive-vscode'; +import * as semver from 'semver'; +import * as vscode from 'vscode'; const extensions = useAllExtensions(); diff --git a/extensions/vscode/src/hybridMode.ts b/extensions/vscode/src/hybridMode.ts index 425a896e9f..38fc895891 100644 --- a/extensions/vscode/src/hybridMode.ts +++ b/extensions/vscode/src/hybridMode.ts @@ -1,8 +1,8 @@ -import * as path from 'node:path'; import * as fs from 'node:fs'; +import * as path from 'node:path'; +import { computed, executeCommand, ref, useAllExtensions, useVscodeContext, watchEffect } from "reactive-vscode"; import * as semver from 'semver'; import * as vscode from 'vscode'; -import { computed, executeCommand, ref, useAllExtensions, useVscodeContext, watchEffect } from "reactive-vscode"; import { incompatibleExtensions, unknownExtensions } from './compatibility'; import { config } from './config'; diff --git a/extensions/vscode/src/languageClient.ts b/extensions/vscode/src/languageClient.ts index 991dec6b8d..4d594ff617 100644 --- a/extensions/vscode/src/languageClient.ts +++ b/extensions/vscode/src/languageClient.ts @@ -4,9 +4,9 @@ import { executeCommand, nextTick, useActiveTextEditor, - useVisibleTextEditors, - useOutputChannel, useCommand, + useOutputChannel, + useVisibleTextEditors, useVscodeContext, watch, } from 'reactive-vscode'; diff --git a/extensions/vscode/src/middleware.ts b/extensions/vscode/src/middleware.ts index d4b22781cb..d7a8d83ddc 100644 --- a/extensions/vscode/src/middleware.ts +++ b/extensions/vscode/src/middleware.ts @@ -1,8 +1,8 @@ +import * as lsp from '@volar/vscode'; import { AttrNameCasing, TagNameCasing } from '@vue/language-server/lib/types'; import * as vscode from 'vscode'; -import * as lsp from '@volar/vscode'; -import { attrNameCasings, tagNameCasings } from './features/nameCasing'; import { config } from './config'; +import { attrNameCasings, tagNameCasings } from './features/nameCasing'; export const middleware: lsp.Middleware = { ...lsp.middleware, diff --git a/extensions/vscode/src/nodeClientMain.ts b/extensions/vscode/src/nodeClientMain.ts index e10985fe8b..ad5de4612f 100644 --- a/extensions/vscode/src/nodeClientMain.ts +++ b/extensions/vscode/src/nodeClientMain.ts @@ -1,12 +1,12 @@ import { createLabsInfo } from '@volar/vscode'; +import * as lsp from '@volar/vscode/node'; import * as protocol from '@vue/language-server/protocol'; import * as fs from 'fs'; -import * as vscode from 'vscode'; -import * as lsp from '@volar/vscode/node'; import { defineExtension, executeCommand, extensionContext, onDeactivate } from 'reactive-vscode'; +import * as vscode from 'vscode'; +import { config } from './config'; import { enabledHybridMode, enabledTypeScriptPlugin } from './hybridMode'; import { activate as activateLanguageClient, deactivate as deactivateLanguageClient } from './languageClient'; -import { config } from './config'; import { middleware } from './middleware'; export const { activate, deactivate } = defineExtension(async () => { diff --git a/extensions/vscode/tests/grammar.spec.ts b/extensions/vscode/tests/grammar.spec.ts index 4790ba6431..5171dc8244 100644 --- a/extensions/vscode/tests/grammar.spec.ts +++ b/extensions/vscode/tests/grammar.spec.ts @@ -1,5 +1,5 @@ -import * as path from 'path'; import * as fs from 'fs'; +import * as path from 'path'; import { describe, expect, it } from 'vitest'; import { createGrammarSnapshot } from 'vscode-tmlanguage-snapshot'; diff --git a/packages/component-meta/index.ts b/packages/component-meta/index.ts index f38e447dfb..e9970a2e25 100644 --- a/packages/component-meta/index.ts +++ b/packages/component-meta/index.ts @@ -1,5 +1,5 @@ import * as ts from 'typescript'; -import { createCheckerByJsonConfigBase, createCheckerBase } from './lib/base'; +import { createCheckerBase, createCheckerByJsonConfigBase } from './lib/base'; import type { MetaCheckerOptions } from './lib/types'; export * from './lib/types'; diff --git a/packages/component-meta/tests/index.spec.ts b/packages/component-meta/tests/index.spec.ts index 4c78583a0b..30436ed23e 100644 --- a/packages/component-meta/tests/index.spec.ts +++ b/packages/component-meta/tests/index.spec.ts @@ -1,6 +1,6 @@ import * as path from 'path'; import { describe, expect, test } from 'vitest'; -import { createChecker, createCheckerByJson, MetaCheckerOptions, ComponentMetaChecker, TypeMeta } from '..'; +import { ComponentMetaChecker, createChecker, createCheckerByJson, MetaCheckerOptions, TypeMeta } from '..'; const worker = (checker: ComponentMetaChecker, withTsconfig: boolean) => describe(`vue-component-meta ${withTsconfig ? 'with tsconfig' : 'without tsconfig'}`, () => { diff --git a/packages/language-core/lib/codegen/localTypes.ts b/packages/language-core/lib/codegen/localTypes.ts index d4939c3bf6..61357423da 100644 --- a/packages/language-core/lib/codegen/localTypes.ts +++ b/packages/language-core/lib/codegen/localTypes.ts @@ -1,7 +1,7 @@ import type * as ts from 'typescript'; import { VueCompilerOptions } from '../types'; import { getSlotsPropertyName } from '../utils/shared'; -import { endOfLine } from './common'; +import { endOfLine } from './utils'; export function getLocalTypesGenerator(compilerOptions: ts.CompilerOptions, vueCompilerOptions: VueCompilerOptions) { const used = new Set(); diff --git a/packages/language-core/lib/codegen/script/component.ts b/packages/language-core/lib/codegen/script/component.ts index 0d2c89d20a..d76ea81197 100644 --- a/packages/language-core/lib/codegen/script/component.ts +++ b/packages/language-core/lib/codegen/script/component.ts @@ -1,6 +1,6 @@ import type { ScriptSetupRanges } from '../../parsers/scriptSetupRanges'; import type { Code, Sfc } from '../../types'; -import { endOfLine, generateSfcBlockSection, newLine } from '../common'; +import { endOfLine, generateSfcBlockSection, newLine } from '../utils'; import type { ScriptCodegenContext } from './context'; import { ScriptCodegenOptions, codeFeatures } from './index'; diff --git a/packages/language-core/lib/codegen/script/componentSelf.ts b/packages/language-core/lib/codegen/script/componentSelf.ts index a75cb87718..bfda805dc1 100644 --- a/packages/language-core/lib/codegen/script/componentSelf.ts +++ b/packages/language-core/lib/codegen/script/componentSelf.ts @@ -1,7 +1,7 @@ import * as path from 'path-browserify'; import type { Code } from '../../types'; -import { endOfLine, generateSfcBlockSection, newLine } from '../common'; import type { TemplateCodegenContext } from '../template/context'; +import { endOfLine, generateSfcBlockSection, newLine } from '../utils'; import { generateComponentSetupReturns, generateEmitsOption, generatePropsOption } from './component'; import type { ScriptCodegenContext } from './context'; import { codeFeatures, type ScriptCodegenOptions } from './index'; diff --git a/packages/language-core/lib/codegen/script/index.ts b/packages/language-core/lib/codegen/script/index.ts index f9865e4eaa..fe32d786cc 100644 --- a/packages/language-core/lib/codegen/script/index.ts +++ b/packages/language-core/lib/codegen/script/index.ts @@ -4,9 +4,9 @@ import type * as ts from 'typescript'; import type { ScriptRanges } from '../../parsers/scriptRanges'; import type { ScriptSetupRanges } from '../../parsers/scriptSetupRanges'; import type { Code, Sfc, VueCodeInformation, VueCompilerOptions } from '../../types'; -import { endOfLine, generateSfcBlockSection, newLine } from '../common'; import { generateGlobalTypes } from '../globalTypes'; import type { TemplateCodegenContext } from '../template/context'; +import { endOfLine, generateSfcBlockSection, newLine } from '../utils'; import { generateComponentSelf } from './componentSelf'; import { createScriptCodegenContext, ScriptCodegenContext } from './context'; import { generateScriptSetup, generateScriptSetupImports } from './scriptSetup'; diff --git a/packages/language-core/lib/codegen/script/scriptSetup.ts b/packages/language-core/lib/codegen/script/scriptSetup.ts index 699f39e287..1ed0398144 100644 --- a/packages/language-core/lib/codegen/script/scriptSetup.ts +++ b/packages/language-core/lib/codegen/script/scriptSetup.ts @@ -1,6 +1,6 @@ import type { ScriptSetupRanges } from '../../parsers/scriptSetupRanges'; import type { Code, Sfc, TextRange } from '../../types'; -import { endOfLine, generateSfcBlockSection, newLine } from '../common'; +import { endOfLine, generateSfcBlockSection, newLine } from '../utils'; import { generateComponent, generateEmitsOption } from './component'; import { generateComponentSelf } from './componentSelf'; import type { ScriptCodegenContext } from './context'; @@ -67,14 +67,14 @@ export function* generateScriptSetup( emitTypes.push(`typeof __VLS_modelEmit`); } - yield ` return {} as {${newLine}` - + ` props: ${ctx.localTypes.PrettifyLocal} & __VLS_BuiltInPublicProps,${newLine}` - + ` expose(exposed: import('${options.vueCompilerOptions.lib}').ShallowUnwrapRef<${scriptSetupRanges.expose.define ? 'typeof __VLS_exposed' : '{}'}>): void,${newLine}` - + ` attrs: any,${newLine}` - + ` slots: __VLS_TemplateResult['slots'],${newLine}` - + ` emit: ${emitTypes.length ? emitTypes.join(' & ') : `{}`},${newLine}` - + ` }${endOfLine}`; - yield ` })(),${newLine}`; // __VLS_setup = (async () => { + yield `return {} as {${newLine}` + + ` props: ${ctx.localTypes.PrettifyLocal} & __VLS_BuiltInPublicProps,${newLine}` + + ` expose(exposed: import('${options.vueCompilerOptions.lib}').ShallowUnwrapRef<${scriptSetupRanges.expose.define ? 'typeof __VLS_exposed' : '{}'}>): void,${newLine}` + + ` attrs: any,${newLine}` + + ` slots: __VLS_TemplateResult['slots'],${newLine}` + + ` emit: ${emitTypes.length ? emitTypes.join(' & ') : `{}`},${newLine}` + + `}${endOfLine}`; + yield `})(),${newLine}`; // __VLS_setup = (async () => { yield `) => ({} as import('${options.vueCompilerOptions.lib}').VNode & { __ctx?: Awaited }))`; } else if (!options.sfc.script) { @@ -360,12 +360,12 @@ function* generateComponentProps( yield `})${endOfLine}`; yield `type __VLS_BuiltInPublicProps = ${options.vueCompilerOptions.target >= 3.4 - ? `import('${options.vueCompilerOptions.lib}').PublicProps;` + ? `import('${options.vueCompilerOptions.lib}').PublicProps` : options.vueCompilerOptions.target >= 3.0 - ? `import('${options.vueCompilerOptions.lib}').VNodeProps - & import('${options.vueCompilerOptions.lib}').AllowedComponentProps - & import('${options.vueCompilerOptions.lib}').ComponentCustomProps;` - : `globalThis.JSX.IntrinsicAttributes;` + ? `import('${options.vueCompilerOptions.lib}').VNodeProps` + + ` & import('${options.vueCompilerOptions.lib}').AllowedComponentProps` + + ` & import('${options.vueCompilerOptions.lib}').ComponentCustomProps` + : `globalThis.JSX.IntrinsicAttributes` }`; yield endOfLine; @@ -468,7 +468,7 @@ function* generateModelEmit( yield `type __VLS_ModelEmit = {${newLine}`; for (const defineModel of defineModels) { const [propName, localName] = getPropAndLocalName(scriptSetup, defineModel); - yield `'update:${propName}': [value:`; + yield `'update:${propName}': [value: `; yield* generateDefinePropType(scriptSetup, propName, localName, defineModel); yield `]${endOfLine}`; } diff --git a/packages/language-core/lib/codegen/script/src.ts b/packages/language-core/lib/codegen/script/src.ts index 44eab3c0eb..2c9aeb0dcb 100644 --- a/packages/language-core/lib/codegen/script/src.ts +++ b/packages/language-core/lib/codegen/script/src.ts @@ -1,5 +1,5 @@ import type { Code, Sfc } from '../../types'; -import { endOfLine } from '../common'; +import { endOfLine } from '../utils'; import { codeFeatures } from './index'; export function* generateSrc( diff --git a/packages/language-core/lib/codegen/script/styleModulesType.ts b/packages/language-core/lib/codegen/script/styleModulesType.ts index f23a7addfa..4e4c30a75a 100644 --- a/packages/language-core/lib/codegen/script/styleModulesType.ts +++ b/packages/language-core/lib/codegen/script/styleModulesType.ts @@ -1,8 +1,8 @@ import type { Code } from '../../types'; +import { endOfLine, newLine } from '../utils'; import type { ScriptCodegenContext } from './context'; import { ScriptCodegenOptions, codeFeatures } from './index'; import { generateCssClassProperty } from './template'; -import { endOfLine, newLine } from '../common'; export function* generateStyleModulesType( options: ScriptCodegenOptions, diff --git a/packages/language-core/lib/codegen/script/template.ts b/packages/language-core/lib/codegen/script/template.ts index 9e119e18b0..7cbaa2d227 100644 --- a/packages/language-core/lib/codegen/script/template.ts +++ b/packages/language-core/lib/codegen/script/template.ts @@ -2,10 +2,10 @@ import * as path from 'path-browserify'; import type * as ts from 'typescript'; import type { Code } from '../../types'; import { getSlotsPropertyName, hyphenateTag } from '../../utils/shared'; -import { endOfLine, newLine } from '../common'; import { TemplateCodegenContext, createTemplateCodegenContext } from '../template/context'; import { forEachInterpolationSegment } from '../template/interpolation'; import { generateStyleScopedClasses } from '../template/styleScopedClasses'; +import { endOfLine, newLine } from '../utils'; import type { ScriptCodegenContext } from './context'; import { codeFeatures, type ScriptCodegenOptions } from './index'; @@ -60,12 +60,11 @@ function* generateTemplateComponents(options: ScriptCodegenOptions): Generator { - ${getSlotsPropertyName(options.vueCompilerOptions.target)}: typeof ${options.scriptSetupRanges?.slots?.name ?? '__VLS_slots'} - }) - }`); + exps.push( + `{} as { [K in ${nameType}]: typeof __VLS_self & (new () => { ` + + getSlotsPropertyName(options.vueCompilerOptions.target) + + ` : typeof ${options.scriptSetupRanges?.slots.name ?? `__VLS_slots`} }) }` + ); } exps.push(`{} as NonNullable`); diff --git a/packages/language-core/lib/codegen/template/context.ts b/packages/language-core/lib/codegen/template/context.ts index 7334ae85a3..e204d791f3 100644 --- a/packages/language-core/lib/codegen/template/context.ts +++ b/packages/language-core/lib/codegen/template/context.ts @@ -1,8 +1,8 @@ import type * as CompilerDOM from '@vue/compiler-dom'; import type { Code, VueCodeInformation } from '../../types'; -import { endOfLine, newLine, wrapWith } from '../common'; -import type { TemplateCodegenOptions } from './index'; import { InlayHintInfo } from '../inlayHints'; +import { endOfLine, newLine, wrapWith } from '../utils'; +import type { TemplateCodegenOptions } from './index'; const _codeFeatures = { all: { diff --git a/packages/language-core/lib/codegen/template/element.ts b/packages/language-core/lib/codegen/template/element.ts index 6fe5abfe31..583c7b5c8b 100644 --- a/packages/language-core/lib/codegen/template/element.ts +++ b/packages/language-core/lib/codegen/template/element.ts @@ -1,22 +1,22 @@ import * as CompilerDOM from '@vue/compiler-dom'; -import type * as ts from 'typescript'; import { camelize, capitalize } from '@vue/shared'; +import type * as ts from 'typescript'; +import { getNodeText } from '../../parsers/scriptSetupRanges'; import type { Code, VueCodeInformation } from '../../types'; import { hyphenateTag } from '../../utils/shared'; -import { collectVars, createTsAst, endOfLine, newLine, variableNameRegex, wrapWith } from '../common'; -import { generateCamelized } from './camelized'; +import { createVBindShorthandInlayHintInfo } from '../inlayHints'; +import { collectVars, createTsAst, endOfLine, newLine, variableNameRegex, wrapWith } from '../utils'; +import { generateCamelized } from '../utils/camelized'; import type { TemplateCodegenContext } from './context'; import { generateElementChildren } from './elementChildren'; import { generateElementDirectives } from './elementDirectives'; import { generateElementEvents } from './elementEvents'; -import { generateElementProps } from './elementProps'; +import { type FailedPropExpression, generateElementProps } from './elementProps'; import type { TemplateCodegenOptions } from './index'; import { generateInterpolation } from './interpolation'; +import { generateObjectProperty } from './objectProperty'; import { generatePropertyAccess } from './propertyAccess'; import { generateTemplateChild } from './templateChild'; -import { generateObjectProperty } from './objectProperty'; -import { createVBindShorthandInlayHintInfo } from '../inlayHints'; -import { getNodeText } from '../../parsers/scriptSetupRanges'; const colonReg = /:/g; @@ -32,11 +32,7 @@ export function* generateComponent( endTagOffset !== undefined && endTagOffset > startTagOffset ? [startTagOffset, endTagOffset] : [startTagOffset]; - const propsFailedExps: { - node: CompilerDOM.SimpleExpressionNode; - prefix: string; - suffix: string; - }[] = []; + const failedPropExps: FailedPropExpression[] = []; const possibleOriginalNames = getPossibleOriginalComponentNames(node.tag, true); const matchImportName = possibleOriginalNames.find(name => options.scriptSetupImportComponentNames.has(name)); const var_originalComponent = matchImportName ?? ctx.getInternalVariable(); @@ -87,8 +83,9 @@ export function* generateComponent( if (matchImportName) { // hover, renaming / find references support yield `// @ts-ignore${newLine}`; // #2304 - yield `[`; + yield `/** @type { [`; for (const tagOffset of tagOffsets) { + yield `typeof ` if (var_originalComponent === node.tag) { yield [ var_originalComponent, @@ -110,9 +107,9 @@ export function* generateComponent( } ); } - yield `,`; + yield `, `; } - yield `]${endOfLine}`; + yield `] } */${endOfLine}`; } else if (dynamicTagInfo) { yield `const ${var_originalComponent} = (`; @@ -178,7 +175,7 @@ export function* generateComponent( yield `, `; } } - yield `] } */${newLine}`; + yield `] } */${endOfLine}`; // auto import support if (options.edited) { yield `// @ts-ignore${newLine}`; // #2304 @@ -213,26 +210,14 @@ export function* generateComponent( startTagOffset + node.tag.length, ctx.codeFeatures.verification, `{`, - ...generateElementProps(options, ctx, node, props, true, propsFailedExps), + ...generateElementProps(options, ctx, node, props, true, failedPropExps), `}` ); yield `, ...__VLS_functionalComponentArgsRest(${var_functionalComponent}))${endOfLine}`; currentComponent = node; - for (const failedExp of propsFailedExps) { - yield* generateInterpolation( - options, - ctx, - failedExp.node.loc.source, - failedExp.node.loc, - failedExp.node.loc.start.offset, - ctx.codeFeatures.all, - failedExp.prefix, - failedExp.suffix - ); - yield endOfLine; - } + yield* generateFailedPropExps(options, ctx, failedPropExps); const [refName, offset] = yield* generateVScope(options, ctx, node, props); const isRootNode = node === ctx.singleRootNode; @@ -302,11 +287,7 @@ export function* generateElement( const endTagOffset = !node.isSelfClosing && options.template.lang === 'html' ? node.loc.start.offset + node.loc.source.lastIndexOf(node.tag) : undefined; - const propsFailedExps: { - node: CompilerDOM.SimpleExpressionNode; - prefix: string; - suffix: string; - }[] = []; + const failedPropExps: FailedPropExpression[] = []; yield `__VLS_elementAsFunction(__VLS_intrinsicElements`; yield* generatePropertyAccess( @@ -332,24 +313,12 @@ export function* generateElement( startTagOffset + node.tag.length, ctx.codeFeatures.verification, `{`, - ...generateElementProps(options, ctx, node, node.props, true, propsFailedExps), + ...generateElementProps(options, ctx, node, node.props, true, failedPropExps), `}` ); yield `)${endOfLine}`; - for (const failedExp of propsFailedExps) { - yield* generateInterpolation( - options, - ctx, - failedExp.node.loc.source, - failedExp.node.loc, - failedExp.node.loc.start.offset, - ctx.codeFeatures.all, - failedExp.prefix, - failedExp.suffix - ); - yield endOfLine; - } + yield* generateFailedPropExps(options, ctx, failedPropExps); const [refName, offset] = yield* generateVScope(options, ctx, node, node.props); if (refName) { @@ -382,6 +351,26 @@ export function* generateElement( } } +function* generateFailedPropExps( + options: TemplateCodegenOptions, + ctx: TemplateCodegenContext, + failedPropExps: FailedPropExpression[] +): Generator { + for (const failedExp of failedPropExps) { + yield* generateInterpolation( + options, + ctx, + failedExp.node.loc.source, + failedExp.node.loc, + failedExp.node.loc.start.offset, + ctx.codeFeatures.all, + failedExp.prefix, + failedExp.suffix + ); + yield endOfLine; + } +} + function* generateVScope( options: TemplateCodegenOptions, ctx: TemplateCodegenContext, @@ -599,7 +588,7 @@ function* generateReferencesForElements( const [content, startOffset] = normalizeAttributeValue(prop.value); yield `// @ts-ignore navigation for \`const ${content} = ref()\`${newLine}`; - yield `__VLS_ctx`; + yield `/** @type { typeof __VLS_ctx`; yield* generatePropertyAccess( options, ctx, @@ -608,7 +597,7 @@ function* generateReferencesForElements( ctx.codeFeatures.navigation, prop.value.loc ); - yield endOfLine; + yield ` } */${endOfLine}`; if (variableNameRegex.test(content)) { ctx.accessExternalVariable(content, startOffset); diff --git a/packages/language-core/lib/codegen/template/elementChildren.ts b/packages/language-core/lib/codegen/template/elementChildren.ts index a184a2c798..0ebbb8e71c 100644 --- a/packages/language-core/lib/codegen/template/elementChildren.ts +++ b/packages/language-core/lib/codegen/template/elementChildren.ts @@ -1,6 +1,6 @@ import * as CompilerDOM from '@vue/compiler-dom'; import type { Code } from '../../types'; -import { endOfLine, wrapWith } from '../common'; +import { endOfLine, wrapWith } from '../utils'; import type { TemplateCodegenContext } from './context'; import type { TemplateCodegenOptions } from './index'; import { generateTemplateChild } from './templateChild'; diff --git a/packages/language-core/lib/codegen/template/elementDirectives.ts b/packages/language-core/lib/codegen/template/elementDirectives.ts index c8ebf4758a..d1953baf67 100644 --- a/packages/language-core/lib/codegen/template/elementDirectives.ts +++ b/packages/language-core/lib/codegen/template/elementDirectives.ts @@ -2,13 +2,13 @@ import * as CompilerDOM from '@vue/compiler-dom'; import { camelize } from '@vue/shared'; import type { Code } from '../../types'; import { hyphenateAttr } from '../../utils/shared'; -import { endOfLine, wrapWith } from '../common'; -import { generateCamelized } from './camelized'; +import { endOfLine, wrapWith } from '../utils'; +import { generateCamelized } from '../utils/camelized'; +import { generateStringLiteralKey } from '../utils/stringLiteralKey'; import type { TemplateCodegenContext } from './context'; import type { TemplateCodegenOptions } from './index'; import { generateInterpolation } from './interpolation'; import { generateObjectProperty } from './objectProperty'; -import { generateStringLiteralKey } from './stringLiteralKey'; export function* generateElementDirectives( options: TemplateCodegenOptions, diff --git a/packages/language-core/lib/codegen/template/elementEvents.ts b/packages/language-core/lib/codegen/template/elementEvents.ts index 57f57c4c74..2184c7aa3e 100644 --- a/packages/language-core/lib/codegen/template/elementEvents.ts +++ b/packages/language-core/lib/codegen/template/elementEvents.ts @@ -3,8 +3,8 @@ import { camelize, capitalize } from '@vue/shared'; import type * as ts from 'typescript'; import type { Code, VueCodeInformation } from '../../types'; import { hyphenateAttr } from '../../utils/shared'; -import { combineLastMapping, createTsAst, endOfLine, newLine, variableNameRegex, wrapWith } from '../common'; -import { generateCamelized } from './camelized'; +import { combineLastMapping, createTsAst, endOfLine, newLine, variableNameRegex, wrapWith } from '../utils'; +import { generateCamelized } from '../utils/camelized'; import type { TemplateCodegenContext } from './context'; import type { TemplateCodegenOptions } from './index'; import { generateInterpolation } from './interpolation'; @@ -17,7 +17,7 @@ export function* generateElementEvents( componentInstanceVar: string, emitVar: string, eventsVar: string -): Generator { +): Generator { let usedComponentEventsVar = false; let propsVar: string | undefined; for (const prop of node.props) { diff --git a/packages/language-core/lib/codegen/template/elementProps.ts b/packages/language-core/lib/codegen/template/elementProps.ts index f6ca405cc8..17c0ad0be6 100644 --- a/packages/language-core/lib/codegen/template/elementProps.ts +++ b/packages/language-core/lib/codegen/template/elementProps.ts @@ -4,14 +4,21 @@ import { minimatch } from 'minimatch'; import { toString } from 'muggle-string'; import type { Code, VueCodeInformation, VueCompilerOptions } from '../../types'; import { hyphenateAttr, hyphenateTag } from '../../utils/shared'; -import { conditionWrapWith, variableNameRegex, wrapWith } from '../common'; -import { generateCamelized } from './camelized'; +import { createVBindShorthandInlayHintInfo } from '../inlayHints'; +import { conditionWrapWith, variableNameRegex, wrapWith } from '../utils'; +import { generateCamelized } from '../utils/camelized'; +import { generateUnicode } from '../utils/unicode'; import type { TemplateCodegenContext } from './context'; import { generateEventArg, generateEventExpression } from './elementEvents'; import type { TemplateCodegenOptions } from './index'; import { generateInterpolation } from './interpolation'; import { generateObjectProperty } from './objectProperty'; -import { createVBindShorthandInlayHintInfo } from '../inlayHints'; + +export interface FailedPropExpression { + node: CompilerDOM.SimpleExpressionNode; + prefix: string; + suffix: string; +} export function* generateElementProps( options: TemplateCodegenOptions, @@ -19,11 +26,7 @@ export function* generateElementProps( node: CompilerDOM.ElementNode, props: CompilerDOM.ElementNode['props'], enableCodeFeatures: boolean, - propsFailedExps?: { - node: CompilerDOM.SimpleExpressionNode; - prefix: string; - suffix: string; - }[] + failedPropExps?: FailedPropExpression[] ): Generator { const isComponent = node.tagType === CompilerDOM.ElementTypes.COMPONENT; @@ -54,14 +57,14 @@ export function* generateElementProps( && prop.arg.loc.source.startsWith('[') && prop.arg.loc.source.endsWith(']') ) { - propsFailedExps?.push({ node: prop.arg, prefix: '(', suffix: ')' }); - propsFailedExps?.push({ node: prop.exp, prefix: '() => {', suffix: '}' }); + failedPropExps?.push({ node: prop.arg, prefix: '(', suffix: ')' }); + failedPropExps?.push({ node: prop.exp, prefix: '() => {', suffix: '}' }); } else if ( !prop.arg && prop.exp?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION ) { - propsFailedExps?.push({ node: prop.exp, prefix: '(', suffix: ')' }); + failedPropExps?.push({ node: prop.exp, prefix: '(', suffix: ')' }); } } } @@ -91,7 +94,7 @@ export function* generateElementProps( || options.vueCompilerOptions.dataAttributes.some(pattern => minimatch(propName!, pattern)) ) { if (prop.exp && prop.exp.constType !== CompilerDOM.ConstantTypes.CAN_STRINGIFY) { - propsFailedExps?.push({ node: prop.exp, prefix: '(', suffix: ')' }); + failedPropExps?.push({ node: prop.exp, prefix: '(', suffix: ')' }); } continue; } @@ -109,7 +112,7 @@ export function* generateElementProps( if (shouldSpread) { yield `...{ `; } - const codeInfo = ctx.codeFeatures.withoutHighlightAndCompletion; + const codeInfo = getPropsCodeInfo(options, ctx, shouldCamelize); const codes = wrapWith( prop.loc.start.offset, prop.loc.end.offset, @@ -121,28 +124,8 @@ export function* generateElementProps( ctx, propName, prop.arg.loc.start.offset, - { - ...codeInfo, - verification: options.vueCompilerOptions.strictTemplates - ? codeInfo.verification - : { - shouldReport(_source, code) { - if (String(code) === '2353' || String(code) === '2561') { - return false; - } - return typeof codeInfo.verification === 'object' - ? codeInfo.verification.shouldReport?.(_source, code) ?? true - : true; - }, - }, - navigation: codeInfo.navigation - ? { - resolveRenameNewName: camelize, - resolveRenameEditText: shouldCamelize ? hyphenateAttr : undefined, - } - : false, - }, - (prop.loc as any).name_2 ?? ((prop.loc as any).name_2 = {}), + codeInfo, + (prop.loc as any).name_2 ??= {}, shouldCamelize ) : wrapWith( @@ -178,7 +161,7 @@ export function* generateElementProps( else if (prop.type === CompilerDOM.NodeTypes.ATTRIBUTE) { if ( options.vueCompilerOptions.dataAttributes.some(pattern => minimatch(prop.name, pattern)) - // Vue 2 Transition doesn't support "persisted" property but `@vue/compiler-dom always adds it (#3881) + // Vue 2 Transition doesn't support "persisted" property but `@vue/compiler-dom` always adds it (#3881) || ( options.vueCompilerOptions.target < 3 && prop.name === 'persisted' @@ -196,32 +179,7 @@ export function* generateElementProps( if (shouldSpread) { yield `...{ `; } - const codeInfo = shouldCamelize - ? { - ...ctx.codeFeatures.withoutHighlightAndCompletion, - navigation: ctx.codeFeatures.withoutHighlightAndCompletion.navigation - ? { - resolveRenameNewName: camelize, - resolveRenameEditText: hyphenateAttr, - } - : false, - } - : { - ...ctx.codeFeatures.withoutHighlightAndCompletion, - }; - if (!options.vueCompilerOptions.strictTemplates) { - const verification = codeInfo.verification; - codeInfo.verification = { - shouldReport(_source, code) { - if (String(code) === '2353' || String(code) === '2561') { - return false; - } - return typeof verification === 'object' - ? verification.shouldReport?.(_source, code) ?? true - : true; - }, - }; - } + const codeInfo = getPropsCodeInfo(options, ctx, true); const codes = conditionWrapWith( enableCodeFeatures, prop.loc.start.offset, @@ -233,7 +191,7 @@ export function* generateElementProps( prop.name, prop.loc.start.offset, codeInfo, - (prop.loc as any).name_1 ?? ((prop.loc as any).name_1 = {}), + (prop.loc as any).name_1 ??= {}, shouldCamelize ), `: (`, @@ -286,13 +244,38 @@ export function* generateElementProps( } yield `, `; } - else { - // comment this line to avoid affecting comments in prop expressions - // tsCodeGen.addText("/* " + [prop.type, prop.name, prop.arg?.loc.source, prop.exp?.loc.source, prop.loc.source].join(", ") + " */ "); - } } } +function getPropsCodeInfo( + options: TemplateCodegenOptions, + ctx: TemplateCodegenContext, + shouldCamelize: boolean +): VueCodeInformation { + const codeInfo = ctx.codeFeatures.withoutHighlightAndCompletion; + return { + ...codeInfo, + navigation: codeInfo.navigation + ? { + resolveRenameNewName: camelize, + resolveRenameEditText: shouldCamelize ? hyphenateAttr : undefined, + } + : false, + verification: options.vueCompilerOptions.strictTemplates + ? codeInfo.verification + : { + shouldReport(_source, code) { + if (String(code) === '2353' || String(code) === '2561') { + return false; + } + return typeof codeInfo.verification === 'object' + ? codeInfo.verification.shouldReport?.(_source, code) ?? true + : true; + }, + } + }; +} + function* generatePropExp( options: TemplateCodegenOptions, ctx: TemplateCodegenContext, @@ -345,45 +328,19 @@ function* generatePropExp( } function* generateAttrValue(attrNode: CompilerDOM.TextNode, features: VueCodeInformation): Generator { - const char = attrNode.loc.source.startsWith("'") ? "'" : '"'; - yield char; + const quote = attrNode.loc.source.startsWith("'") ? "'" : '"'; + yield quote; let start = attrNode.loc.start.offset; - let end = attrNode.loc.end.offset; let content = attrNode.loc.source; if ( (content.startsWith('"') && content.endsWith('"')) || (content.startsWith("'") && content.endsWith("'")) ) { start++; - end--; content = content.slice(1, -1); } - if (needToUnicode(content)) { - yield* wrapWith( - start, - end, - features, - toUnicode(content) - ); - } - else { - yield [content, 'template', start, features]; - } - yield char; -} - -function needToUnicode(str: string) { - return str.includes('\\') || str.includes('\n'); -} - -function toUnicode(str: string) { - return str.split('').map(value => { - const temp = value.charCodeAt(0).toString(16).padStart(4, '0'); - if (temp.length > 2) { - return '\\u' + temp; - } - return value; - }).join(''); + yield* generateUnicode(content, start, features); + yield quote; } function getModelValuePropName(node: CompilerDOM.ElementNode, vueVersion: number, vueCompilerOptions: VueCompilerOptions) { diff --git a/packages/language-core/lib/codegen/template/index.ts b/packages/language-core/lib/codegen/template/index.ts index feac4f497a..a0776541a3 100644 --- a/packages/language-core/lib/codegen/template/index.ts +++ b/packages/language-core/lib/codegen/template/index.ts @@ -1,13 +1,13 @@ import * as CompilerDOM from '@vue/compiler-dom'; import type * as ts from 'typescript'; import type { Code, Sfc, VueCompilerOptions } from '../../types'; -import { endOfLine, newLine, wrapWith } from '../common'; +import { endOfLine, newLine, wrapWith } from '../utils'; +import { generateStringLiteralKey } from '../utils/stringLiteralKey'; import { TemplateCodegenContext, createTemplateCodegenContext } from './context'; import { getCanonicalComponentName, getPossibleOriginalComponentNames } from './element'; import { generateObjectProperty } from './objectProperty'; -import { generateStringLiteralKey } from './stringLiteralKey'; -import { generateTemplateChild, getVForNode } from './templateChild'; import { generateStyleScopedClasses } from './styleScopedClasses'; +import { generateTemplateChild, getVForNode } from './templateChild'; export interface TemplateCodegenOptions { ts: typeof ts; @@ -138,7 +138,7 @@ function* generatePreResolveComponents(options: TemplateCodegenOptions): Generat yield newLine; yield ` & __VLS_WithComponent<'${getCanonicalComponentName(node.tag)}', typeof __VLS_localComponents, `; yield getPossibleOriginalComponentNames(node.tag, false) - .map(name => `"${name}"`) + .map(name => `'${name}'`) .join(', '); yield `>`; } diff --git a/packages/language-core/lib/codegen/template/interpolation.ts b/packages/language-core/lib/codegen/template/interpolation.ts index 8880aa879c..57e87ec077 100644 --- a/packages/language-core/lib/codegen/template/interpolation.ts +++ b/packages/language-core/lib/codegen/template/interpolation.ts @@ -1,8 +1,8 @@ -import { isGloballyWhitelisted } from '@vue/shared'; +import { isGloballyAllowed } from '@vue/shared'; import type * as ts from 'typescript'; import { getNodeText, getStartEnd } from '../../parsers/scriptSetupRanges'; import type { Code, VueCodeInformation } from '../../types'; -import { collectVars, createTsAst } from '../common'; +import { collectVars, createTsAst } from '../utils'; import type { TemplateCodegenContext } from './context'; import type { TemplateCodegenOptions } from './index'; @@ -87,7 +87,7 @@ export function* forEachInterpolationSegment( if ( ctx.hasLocalVariable(text) || // https://github.com/vuejs/core/blob/245230e135152900189f13a4281302de45fdcfaa/packages/compiler-core/src/transforms/transformExpression.ts#L342-L352 - isGloballyWhitelisted(text) || + isGloballyAllowed(text) || text === 'require' || text.startsWith('__VLS_') ) { diff --git a/packages/language-core/lib/codegen/template/objectProperty.ts b/packages/language-core/lib/codegen/template/objectProperty.ts index 812943c8da..cea9ebe045 100644 --- a/packages/language-core/lib/codegen/template/objectProperty.ts +++ b/packages/language-core/lib/codegen/template/objectProperty.ts @@ -1,11 +1,11 @@ import { camelize } from '@vue/shared'; import type { Code, VueCodeInformation } from '../../types'; -import { combineLastMapping, variableNameRegex, wrapWith } from '../common'; -import { generateCamelized } from './camelized'; +import { combineLastMapping, variableNameRegex, wrapWith } from '../utils'; +import { generateCamelized } from '../utils/camelized'; +import { generateStringLiteralKey } from '../utils/stringLiteralKey'; import type { TemplateCodegenContext } from './context'; import type { TemplateCodegenOptions } from './index'; import { generateInterpolation } from './interpolation'; -import { generateStringLiteralKey } from './stringLiteralKey'; export function* generateObjectProperty( options: TemplateCodegenOptions, @@ -43,9 +43,9 @@ export function* generateObjectProperty( offset, offset + code.length, features, - `"`, + `'`, ...generateCamelized(code, offset, combineLastMapping), - `"` + `'` ); } } diff --git a/packages/language-core/lib/codegen/template/propertyAccess.ts b/packages/language-core/lib/codegen/template/propertyAccess.ts index d763ae41e6..0b4c500d6a 100644 --- a/packages/language-core/lib/codegen/template/propertyAccess.ts +++ b/packages/language-core/lib/codegen/template/propertyAccess.ts @@ -1,9 +1,9 @@ import type { Code, VueCodeInformation } from '../../types'; -import { variableNameRegex } from '../common'; +import { variableNameRegex } from '../utils'; +import { generateStringLiteralKey } from '../utils/stringLiteralKey'; import type { TemplateCodegenContext } from './context'; import type { TemplateCodegenOptions } from './index'; import { generateInterpolation } from './interpolation'; -import { generateStringLiteralKey } from './stringLiteralKey'; export function* generatePropertyAccess( options: TemplateCodegenOptions, diff --git a/packages/language-core/lib/codegen/template/slotOutlet.ts b/packages/language-core/lib/codegen/template/slotOutlet.ts index 021d51faf7..f21d337ce6 100644 --- a/packages/language-core/lib/codegen/template/slotOutlet.ts +++ b/packages/language-core/lib/codegen/template/slotOutlet.ts @@ -1,12 +1,12 @@ import * as CompilerDOM from '@vue/compiler-dom'; import type { Code } from '../../types'; -import { endOfLine, newLine, wrapWith } from '../common'; +import { createVBindShorthandInlayHintInfo } from '../inlayHints'; +import { endOfLine, newLine, wrapWith } from '../utils'; import type { TemplateCodegenContext } from './context'; import { generateElementChildren } from './elementChildren'; import { generateElementProps } from './elementProps'; import type { TemplateCodegenOptions } from './index'; import { generateInterpolation } from './interpolation'; -import { createVBindShorthandInlayHintInfo } from '../inlayHints'; export function* generateSlotOutlet( options: TemplateCodegenOptions, diff --git a/packages/language-core/lib/codegen/template/styleScopedClasses.ts b/packages/language-core/lib/codegen/template/styleScopedClasses.ts index fe1777866b..86a1f5ce4e 100644 --- a/packages/language-core/lib/codegen/template/styleScopedClasses.ts +++ b/packages/language-core/lib/codegen/template/styleScopedClasses.ts @@ -1,6 +1,6 @@ import type { Code } from '../../types'; +import { endOfLine, newLine } from '../utils'; import type { TemplateCodegenContext } from './context'; -import { endOfLine, newLine } from '../common'; export function* generateStyleScopedClasses( ctx: TemplateCodegenContext, diff --git a/packages/language-core/lib/codegen/template/templateChild.ts b/packages/language-core/lib/codegen/template/templateChild.ts index 69be101239..e8ded97eb7 100644 --- a/packages/language-core/lib/codegen/template/templateChild.ts +++ b/packages/language-core/lib/codegen/template/templateChild.ts @@ -1,6 +1,6 @@ import * as CompilerDOM from '@vue/compiler-dom'; import type { Code } from '../../types'; -import { endOfLine, newLine } from '../common'; +import { endOfLine, newLine } from '../utils'; import type { TemplateCodegenContext } from './context'; import { generateComponent, generateElement } from './element'; import type { TemplateCodegenOptions } from './index'; diff --git a/packages/language-core/lib/codegen/template/vFor.ts b/packages/language-core/lib/codegen/template/vFor.ts index 14e5941ac8..36c55692ac 100644 --- a/packages/language-core/lib/codegen/template/vFor.ts +++ b/packages/language-core/lib/codegen/template/vFor.ts @@ -1,6 +1,6 @@ import * as CompilerDOM from '@vue/compiler-dom'; import type { Code } from '../../types'; -import { collectVars, createTsAst, endOfLine, newLine } from '../common'; +import { collectVars, createTsAst, endOfLine, newLine } from '../utils'; import type { TemplateCodegenContext } from './context'; import type { TemplateCodegenOptions } from './index'; import { generateInterpolation } from './interpolation'; diff --git a/packages/language-core/lib/codegen/template/vIf.ts b/packages/language-core/lib/codegen/template/vIf.ts index e12e14b215..1a73d2fccd 100644 --- a/packages/language-core/lib/codegen/template/vIf.ts +++ b/packages/language-core/lib/codegen/template/vIf.ts @@ -1,7 +1,7 @@ import * as CompilerDOM from '@vue/compiler-dom'; import { toString } from 'muggle-string'; import type { Code } from '../../types'; -import { newLine } from '../common'; +import { newLine } from '../utils'; import type { TemplateCodegenContext } from './context'; import type { TemplateCodegenOptions } from './index'; import { generateInterpolation } from './interpolation'; diff --git a/packages/language-core/lib/codegen/template/camelized.ts b/packages/language-core/lib/codegen/utils/camelized.ts similarity index 92% rename from packages/language-core/lib/codegen/template/camelized.ts rename to packages/language-core/lib/codegen/utils/camelized.ts index d0aaab5b10..c2e5ca3f01 100644 --- a/packages/language-core/lib/codegen/template/camelized.ts +++ b/packages/language-core/lib/codegen/utils/camelized.ts @@ -1,6 +1,6 @@ import { capitalize } from '@vue/shared'; import type { Code, VueCodeInformation } from '../../types'; -import { combineLastMapping } from '../common'; +import { combineLastMapping } from './index'; export function* generateCamelized(code: string, offset: number, info: VueCodeInformation): Generator { const parts = code.split('-'); diff --git a/packages/language-core/lib/codegen/common.ts b/packages/language-core/lib/codegen/utils/index.ts similarity index 93% rename from packages/language-core/lib/codegen/common.ts rename to packages/language-core/lib/codegen/utils/index.ts index a2d925b5d3..b297524222 100644 --- a/packages/language-core/lib/codegen/common.ts +++ b/packages/language-core/lib/codegen/utils/index.ts @@ -1,8 +1,8 @@ import type * as ts from 'typescript'; -import { getNodeText } from '../parsers/scriptSetupRanges'; -import type { Code, SfcBlock, VueCodeInformation } from '../types'; +import { getNodeText } from '../../parsers/scriptSetupRanges'; +import type { Code, SfcBlock, VueCodeInformation } from '../../types'; -export const newLine = '\n'; +export const newLine = `\n`; export const endOfLine = `;${newLine}`; export const combineLastMapping: VueCodeInformation = { __combineLastMapping: true }; export const variableNameRegex = /^[a-zA-Z_$][0-9a-zA-Z_$]*$/; diff --git a/packages/language-core/lib/codegen/template/stringLiteralKey.ts b/packages/language-core/lib/codegen/utils/stringLiteralKey.ts similarity index 79% rename from packages/language-core/lib/codegen/template/stringLiteralKey.ts rename to packages/language-core/lib/codegen/utils/stringLiteralKey.ts index ef7dff8925..bfeb191ce2 100644 --- a/packages/language-core/lib/codegen/template/stringLiteralKey.ts +++ b/packages/language-core/lib/codegen/utils/stringLiteralKey.ts @@ -1,18 +1,18 @@ import type { Code, VueCodeInformation } from '../../types'; -import { combineLastMapping, wrapWith } from '../common'; +import { combineLastMapping, wrapWith } from './index'; export function* generateStringLiteralKey(code: string, offset?: number, info?: VueCodeInformation): Generator { if (offset === undefined || !info) { - yield `"${code}"`; + yield `'${code}'`; } else { yield* wrapWith( offset, offset + code.length, info, - `"`, + `'`, [code, 'template', offset, combineLastMapping], - `"` + `'` ); } } diff --git a/packages/language-core/lib/codegen/utils/unicode.ts b/packages/language-core/lib/codegen/utils/unicode.ts new file mode 100644 index 0000000000..6d675aa441 --- /dev/null +++ b/packages/language-core/lib/codegen/utils/unicode.ts @@ -0,0 +1,30 @@ +import type { Code, VueCodeInformation } from '../../types'; +import { wrapWith } from './index'; + +export function* generateUnicode(code: string, offset: number, info: VueCodeInformation): Generator { + if (needToUnicode(code)) { + yield* wrapWith( + offset, + offset + code.length, + info, + toUnicode(code) + ); + } + else { + yield [code, 'template', offset, info]; + } +} + +function needToUnicode(str: string) { + return str.includes('\\') || str.includes('\n'); +} + +function toUnicode(str: string) { + return str.split('').map(value => { + const temp = value.charCodeAt(0).toString(16).padStart(4, '0'); + if (temp.length > 2) { + return '\\u' + temp; + } + return value; + }).join(''); +} diff --git a/packages/language-core/lib/parsers/scriptRanges.ts b/packages/language-core/lib/parsers/scriptRanges.ts index 394eb16dce..8754e08544 100644 --- a/packages/language-core/lib/parsers/scriptRanges.ts +++ b/packages/language-core/lib/parsers/scriptRanges.ts @@ -1,5 +1,5 @@ -import type { TextRange } from '../types'; import type * as ts from 'typescript'; +import type { TextRange } from '../types'; import { getNodeText, getStartEnd, parseBindingRanges } from './scriptSetupRanges'; export interface ScriptRanges extends ReturnType { } diff --git a/packages/language-core/lib/parsers/scriptSetupRanges.ts b/packages/language-core/lib/parsers/scriptSetupRanges.ts index da978db002..d3c62def2d 100644 --- a/packages/language-core/lib/parsers/scriptSetupRanges.ts +++ b/packages/language-core/lib/parsers/scriptSetupRanges.ts @@ -1,6 +1,6 @@ import type * as ts from 'typescript'; -import type { VueCompilerOptions, TextRange } from '../types'; -import { collectIdentifiers } from '../codegen/common'; +import { collectIdentifiers } from '../codegen/utils'; +import type { TextRange, VueCompilerOptions } from '../types'; export interface ScriptSetupRanges extends ReturnType { } diff --git a/packages/language-core/lib/plugins/vue-template-inline-ts.ts b/packages/language-core/lib/plugins/vue-template-inline-ts.ts index f23bc015ff..e10eabf5ca 100644 --- a/packages/language-core/lib/plugins/vue-template-inline-ts.ts +++ b/packages/language-core/lib/plugins/vue-template-inline-ts.ts @@ -1,10 +1,10 @@ import type { CodeInformation } from '@volar/language-core'; -import { createTsAst } from '../codegen/common'; +import * as CompilerDOM from '@vue/compiler-dom'; import { isCompoundExpression } from '../codegen/template/elementEvents'; import { parseInterpolationNode } from '../codegen/template/templateChild'; import { parseVForNode } from '../codegen/template/vFor'; +import { createTsAst } from '../codegen/utils'; import type { Code, Sfc, VueLanguagePlugin } from '../types'; -import * as CompilerDOM from '@vue/compiler-dom'; const codeFeatures: CodeInformation = { format: true, diff --git a/packages/language-core/lib/utils/buildMappings.ts b/packages/language-core/lib/utils/buildMappings.ts index a39aec3508..ed73029e05 100644 --- a/packages/language-core/lib/utils/buildMappings.ts +++ b/packages/language-core/lib/utils/buildMappings.ts @@ -1,5 +1,5 @@ -import type { Segment } from 'muggle-string'; import type { Mapping } from '@volar/language-core'; +import type { Segment } from 'muggle-string'; export function buildMappings(chunks: Segment[]) { let length = 0; diff --git a/packages/language-core/lib/utils/findDestructuredProps.ts b/packages/language-core/lib/utils/findDestructuredProps.ts deleted file mode 100644 index e69de29bb2..0000000000 diff --git a/packages/language-core/lib/utils/parseSfc.ts b/packages/language-core/lib/utils/parseSfc.ts index 1bd6779528..096e0e733c 100644 --- a/packages/language-core/lib/utils/parseSfc.ts +++ b/packages/language-core/lib/utils/parseSfc.ts @@ -1,6 +1,6 @@ -import type { CompilerError, SFCDescriptor, SFCBlock, SFCStyleBlock, SFCScriptBlock, SFCTemplateBlock, SFCParseResult } from '@vue/compiler-sfc'; import type { ElementNode, SourceLocation } from '@vue/compiler-dom'; import * as compiler from '@vue/compiler-dom'; +import type { CompilerError, SFCBlock, SFCDescriptor, SFCParseResult, SFCScriptBlock, SFCStyleBlock, SFCTemplateBlock } from '@vue/compiler-sfc'; import { SFCStyleOverride } from '../types'; export function parse(source: string): SFCParseResult { diff --git a/packages/language-core/lib/utils/ts.ts b/packages/language-core/lib/utils/ts.ts index fa57417ef6..ec2430f613 100644 --- a/packages/language-core/lib/utils/ts.ts +++ b/packages/language-core/lib/utils/ts.ts @@ -1,9 +1,9 @@ import { camelize } from '@vue/shared'; -import type * as ts from 'typescript'; import { posix as path } from 'path-browserify'; -import type { RawVueCompilerOptions, VueCompilerOptions, VueLanguagePlugin } from '../types'; -import { getAllExtensions } from '../languagePlugin'; +import type * as ts from 'typescript'; import { generateGlobalTypes } from '../codegen/globalTypes'; +import { getAllExtensions } from '../languagePlugin'; +import type { RawVueCompilerOptions, VueCompilerOptions, VueLanguagePlugin } from '../types'; export type ParsedCommandLine = ts.ParsedCommandLine & { vueOptions: VueCompilerOptions; diff --git a/packages/language-plugin-pug/index.ts b/packages/language-plugin-pug/index.ts index cfb471f6be..97e37f6415 100644 --- a/packages/language-plugin-pug/index.ts +++ b/packages/language-plugin-pug/index.ts @@ -1,6 +1,6 @@ +import { SourceMap } from '@volar/source-map'; import type { VueLanguagePlugin } from '@vue/language-core'; import * as pug from 'volar-service-pug/lib/languageService'; -import { SourceMap } from '@volar/source-map'; const plugin: VueLanguagePlugin = ({ modules }) => { diff --git a/packages/language-service/index.ts b/packages/language-service/index.ts index bf4ed50965..6710688c2b 100644 --- a/packages/language-service/index.ts +++ b/packages/language-service/index.ts @@ -16,17 +16,17 @@ import { create as createTypeScriptTwoslashQueriesPlugin } from 'volar-service-t import { create as createTypeScriptDocCommentTemplatePlugin } from 'volar-service-typescript/lib/plugins/docCommentTemplate'; import { create as createTypeScriptSyntacticPlugin } from 'volar-service-typescript/lib/plugins/syntactic'; import { create as createCssPlugin } from './lib/plugins/css'; -import { create as createVueAutoDefineAssignmentPlugin } from './lib/plugins/vue-complete-define-assignment'; import { create as createVueAutoDotValuePlugin } from './lib/plugins/vue-autoinsert-dotvalue'; import { create as createVueAutoAddSpacePlugin } from './lib/plugins/vue-autoinsert-space'; +import { create as createVueCompleteDefineAssignmentPlugin } from './lib/plugins/vue-complete-define-assignment'; import { create as createVueDirectiveCommentsPlugin } from './lib/plugins/vue-directive-comments'; import { create as createVueDocumentDropPlugin } from './lib/plugins/vue-document-drop'; import { create as createVueDocumentLinksPlugin } from './lib/plugins/vue-document-links'; import { create as createVueExtractFilePlugin } from './lib/plugins/vue-extract-file'; +import { create as createVueInlayHintsPlugin } from './lib/plugins/vue-inlayhints'; import { create as createVueSfcPlugin } from './lib/plugins/vue-sfc'; import { create as createVueTemplatePlugin } from './lib/plugins/vue-template'; import { create as createVueTwoslashQueriesPlugin } from './lib/plugins/vue-twoslash-queries'; -import { create as createVueInlayHintsPlugin } from './lib/plugins/vue-inlayhints'; import { parse, VueCompilerOptions } from '@vue/language-core'; import { proxyLanguageServiceForVue } from '@vue/typescript-plugin/lib/common'; @@ -198,7 +198,7 @@ function getCommonLanguageServicePlugins( createVueTwoslashQueriesPlugin(getTsPluginClient), createVueDocumentLinksPlugin(), createVueDocumentDropPlugin(ts, getTsPluginClient), - createVueAutoDefineAssignmentPlugin(), + createVueCompleteDefineAssignmentPlugin(), createVueAutoDotValuePlugin(ts, getTsPluginClient), createVueAutoAddSpacePlugin(), createVueInlayHintsPlugin(ts), diff --git a/packages/language-service/lib/plugins/vue-inlayhints.ts b/packages/language-service/lib/plugins/vue-inlayhints.ts index 827d34d8a5..c9e0536e9a 100644 --- a/packages/language-service/lib/plugins/vue-inlayhints.ts +++ b/packages/language-service/lib/plugins/vue-inlayhints.ts @@ -1,10 +1,10 @@ import type { LanguageServicePluginInstance } from '@volar/language-service'; import { tsCodegen, VueVirtualCode } from '@vue/language-core'; +import { collectIdentifiers } from '@vue/language-core/lib/codegen/utils/index'; +import type * as ts from 'typescript'; import type * as vscode from 'vscode-languageserver-protocol'; import { URI } from 'vscode-uri'; import type { LanguageServicePlugin } from '../types'; -import type * as ts from 'typescript'; -import { collectIdentifiers } from '@vue/language-core/lib/codegen/common'; export function create(ts: typeof import('typescript')): LanguageServicePlugin { return { diff --git a/packages/language-service/lib/plugins/vue-sfc.ts b/packages/language-service/lib/plugins/vue-sfc.ts index f5d059c6d6..d8733792d3 100644 --- a/packages/language-service/lib/plugins/vue-sfc.ts +++ b/packages/language-service/lib/plugins/vue-sfc.ts @@ -1,11 +1,11 @@ -import type { LanguageServicePlugin, LanguageServicePluginInstance, LanguageServiceContext } from '@volar/language-service'; +import type { LanguageServiceContext, LanguageServicePlugin, LanguageServicePluginInstance } from '@volar/language-service'; import * as vue from '@vue/language-core'; import { create as createHtmlService } from 'volar-service-html'; import * as html from 'vscode-html-languageservice'; import type * as vscode from 'vscode-languageserver-protocol'; import type { TextDocument } from 'vscode-languageserver-textdocument'; -import { loadLanguageBlocks } from './data'; import { URI } from 'vscode-uri'; +import { loadLanguageBlocks } from './data'; let sfcDataProvider: html.IHTMLDataProvider | undefined; diff --git a/packages/tsc/tests/__snapshots__/dts.spec.ts.snap b/packages/tsc/tests/__snapshots__/dts.spec.ts.snap index e26d792a89..91cc664194 100644 --- a/packages/tsc/tests/__snapshots__/dts.spec.ts.snap +++ b/packages/tsc/tests/__snapshots__/dts.spec.ts.snap @@ -628,11 +628,11 @@ exports[`vue-tsc-dts > Input: template-slots/component.vue, Output: template-slo "declare function __VLS_template(): { attrs: Partial<{}>; slots: { - "no-bind"?(_: {}): any; + 'no-bind'?(_: {}): any; default?(_: { num: number; }): any; - "named-slot"?(_: { + 'named-slot'?(_: { str: string; }): any; vbind?(_: { @@ -730,11 +730,11 @@ exports[`vue-tsc-dts > Input: template-slots/component-no-script.vue, Output: te "declare function __VLS_template(): { attrs: Partial<{}>; slots: { - "no-bind"?(_: {}): any; + 'no-bind'?(_: {}): any; default?(_: { num: number; }): any; - "named-slot"?(_: { + 'named-slot'?(_: { str: string; }): any; vbind?(_: { diff --git a/packages/tsc/tests/dts.spec.ts b/packages/tsc/tests/dts.spec.ts index 2f2c8a0234..85dae0440c 100644 --- a/packages/tsc/tests/dts.spec.ts +++ b/packages/tsc/tests/dts.spec.ts @@ -1,9 +1,9 @@ -import * as path from 'path'; +import { proxyCreateProgram } from '@volar/typescript'; +import * as vue from '@vue/language-core'; import * as fs from 'fs'; +import * as path from 'path'; import * as ts from 'typescript'; import { describe, expect, it } from 'vitest'; -import { proxyCreateProgram } from '@volar/typescript'; -import * as vue from '@vue/language-core'; const workspace = path.resolve(__dirname, '../../../test-workspace/component-meta'); const normalizePath = (filename: string) => filename.replace(/\\/g, '/'); diff --git a/packages/typescript-plugin/index.ts b/packages/typescript-plugin/index.ts index 322f4cedb4..d79e8d74ea 100644 --- a/packages/typescript-plugin/index.ts +++ b/packages/typescript-plugin/index.ts @@ -1,8 +1,8 @@ import { createLanguageServicePlugin } from '@volar/typescript/lib/quickstart/createLanguageServicePlugin'; import * as vue from '@vue/language-core'; +import type * as ts from 'typescript'; import { proxyLanguageServiceForVue } from './lib/common'; import { startNamedPipeServer } from './lib/server'; -import type * as ts from 'typescript'; const windowsPathReg = /\\/g; const vueCompilerOptions = new WeakMap(); From f275c2abfdd4b86e042ec4142ef45879be4f971d Mon Sep 17 00:00:00 2001 From: KazariEX <1364035137@qq.com> Date: Sat, 2 Nov 2024 17:50:26 +0800 Subject: [PATCH 004/345] fix(language-core): generate empty scoped classname for `:class` --- .../language-core/lib/codegen/template/element.ts | 15 ++++++++++----- 1 file changed, 10 insertions(+), 5 deletions(-) diff --git a/packages/language-core/lib/codegen/template/element.ts b/packages/language-core/lib/codegen/template/element.ts index 583c7b5c8b..2c68310921 100644 --- a/packages/language-core/lib/codegen/template/element.ts +++ b/packages/language-core/lib/codegen/template/element.ts @@ -685,11 +685,16 @@ function* generateReferencesForScopedCssClasses( }); for (const literal of literals) { - const classes = collectClasses( - literal.text, - literal.end - literal.text.length - 1 + startOffset - ); - ctx.scopedClasses.push(...classes); + if (literal.text) { + const classes = collectClasses( + literal.text, + literal.end - literal.text.length - 1 + startOffset + ); + ctx.scopedClasses.push(...classes); + } + else { + ctx.emptyClassOffsets.push(literal.end - 1 + startOffset); + } } function walkArrayLiteral(node: ts.ArrayLiteralExpression) { From a7d6f68feed71870505723175773b277aafa6e29 Mon Sep 17 00:00:00 2001 From: KazariEX <1364035137@qq.com> Date: Sat, 2 Nov 2024 18:01:19 +0800 Subject: [PATCH 005/345] fix(language-core): should exit incremental update when binding expression is empty --- packages/language-core/lib/plugins/vue-template-html.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/packages/language-core/lib/plugins/vue-template-html.ts b/packages/language-core/lib/plugins/vue-template-html.ts index 75bbabe513..e06a3a605b 100644 --- a/packages/language-core/lib/plugins/vue-template-html.ts +++ b/packages/language-core/lib/plugins/vue-template-html.ts @@ -181,6 +181,10 @@ const plugin: VueLanguagePlugin = ({ modules }) => { if (node.isStatic) { return false; } + else if (!node.loc.source) { + // :class="..." -> :class="" + return false; + } else { node.content = node.loc.source; } From 1a9eb261b528afb4a9fb846fc63fc99eb200f8d3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=B1=B1=E5=90=B9=E8=89=B2=E5=BE=A1=E5=AE=88?= <85992002+KazariEX@users.noreply.github.com> Date: Sat, 2 Nov 2024 19:26:20 +0800 Subject: [PATCH 006/345] fix(language-core): generate script setup starting from last leading comment without `@ts-check` (#4900) --- .../lib/codegen/script/scriptSetup.ts | 2 +- .../lib/parsers/scriptSetupRanges.ts | 8 +++++++- .../tsc/passedFixtures/vue3/#4899/main.vue | 15 +++++++++++++++ 3 files changed, 23 insertions(+), 2 deletions(-) create mode 100644 test-workspace/tsc/passedFixtures/vue3/#4899/main.vue diff --git a/packages/language-core/lib/codegen/script/scriptSetup.ts b/packages/language-core/lib/codegen/script/scriptSetup.ts index 1ed0398144..491a4328ff 100644 --- a/packages/language-core/lib/codegen/script/scriptSetup.ts +++ b/packages/language-core/lib/codegen/script/scriptSetup.ts @@ -249,7 +249,7 @@ function* generateSetupFunction( } setupCodeModifies = setupCodeModifies.sort((a, b) => a[1] - b[1]); - let nextStart = scriptSetupRanges.importSectionEndOffset; + let nextStart = Math.max(scriptSetupRanges.importSectionEndOffset, scriptSetupRanges.leadingCommentEndOffset); for (const [codes, start, end] of setupCodeModifies) { yield generateSfcBlockSection(scriptSetup, nextStart, start, codeFeatures.all); for (const code of codes) { diff --git a/packages/language-core/lib/parsers/scriptSetupRanges.ts b/packages/language-core/lib/parsers/scriptSetupRanges.ts index d3c62def2d..b020a7f24b 100644 --- a/packages/language-core/lib/parsers/scriptSetupRanges.ts +++ b/packages/language-core/lib/parsers/scriptSetupRanges.ts @@ -2,6 +2,8 @@ import type * as ts from 'typescript'; import { collectIdentifiers } from '../codegen/utils'; import type { TextRange, VueCompilerOptions } from '../types'; +const tsCheckReg = /^\/\/\s*@ts-(?:no)?check($|\s)/; + export interface ScriptSetupRanges extends ReturnType { } export function parseScriptSetupRanges( @@ -66,9 +68,13 @@ export function parseScriptSetupRanges( isModel?: boolean; }[] = []; const text = ast.text; - const leadingCommentEndOffset = ts.getLeadingCommentRanges(text, 0)?.reverse()[0].end ?? 0; const importComponentNames = new Set(); + const leadingCommentRanges = ts.getLeadingCommentRanges(text, 0)?.reverse() ?? []; + const leadingCommentEndOffset = leadingCommentRanges.find( + range => tsCheckReg.test(text.slice(range.pos, range.end)) + )?.end ?? 0; + let bindings = parseBindingRanges(ts, ast); ts.forEachChild(ast, node => { diff --git a/test-workspace/tsc/passedFixtures/vue3/#4899/main.vue b/test-workspace/tsc/passedFixtures/vue3/#4899/main.vue new file mode 100644 index 0000000000..d37484012e --- /dev/null +++ b/test-workspace/tsc/passedFixtures/vue3/#4899/main.vue @@ -0,0 +1,15 @@ + \ No newline at end of file From 34e69823669cf9f779d8f642763e9b15a83bb317 Mon Sep 17 00:00:00 2001 From: KazariEX <1364035137@qq.com> Date: Sat, 2 Nov 2024 19:37:59 +0800 Subject: [PATCH 007/345] refactor: use `slice` instead of `substring` --- extensions/vscode/src/features/doctor.ts | 2 +- packages/component-meta/lib/base.ts | 12 +++++----- .../lib/codegen/script/componentSelf.ts | 2 +- .../lib/codegen/script/context.ts | 4 ++-- .../lib/codegen/script/scriptSetup.ts | 4 ++-- .../language-core/lib/codegen/script/src.ts | 6 ++--- .../lib/codegen/script/template.ts | 10 ++++----- .../lib/codegen/template/element.ts | 4 ++-- .../lib/codegen/template/elementProps.ts | 2 +- .../lib/codegen/template/interpolation.ts | 22 +++++++++---------- .../lib/codegen/template/slotOutlet.ts | 2 +- .../lib/codegen/template/templateChild.ts | 4 ++-- .../lib/codegen/template/vFor.ts | 2 +- .../language-core/lib/codegen/utils/index.ts | 2 +- packages/language-core/lib/languagePlugin.ts | 2 +- .../lib/parsers/scriptSetupRanges.ts | 4 ++-- .../language-core/lib/plugins/file-html.ts | 2 +- packages/language-core/lib/plugins/file-md.ts | 2 +- .../language-core/lib/plugins/file-vue.ts | 4 ++-- .../lib/plugins/vue-root-tags.ts | 4 ++-- .../lib/plugins/vue-template-html.ts | 4 ++-- .../lib/plugins/vue-template-inline-css.ts | 2 +- .../lib/plugins/vue-template-inline-ts.ts | 2 +- packages/language-core/lib/plugins/vue-tsx.ts | 2 +- packages/language-server/lib/initialize.ts | 2 +- .../lib/plugins/vue-autoinsert-dotvalue.ts | 2 +- .../lib/plugins/vue-autoinsert-space.ts | 2 +- .../lib/plugins/vue-directive-comments.ts | 2 +- .../lib/plugins/vue-document-drop.ts | 6 ++--- .../lib/plugins/vue-document-links.ts | 6 ++--- .../lib/plugins/vue-extract-file.ts | 4 ++-- .../lib/plugins/vue-template.ts | 22 +++++++++---------- 32 files changed, 76 insertions(+), 76 deletions(-) diff --git a/extensions/vscode/src/features/doctor.ts b/extensions/vscode/src/features/doctor.ts index b6281c5a07..4de7b7c646 100644 --- a/extensions/vscode/src/features/doctor.ts +++ b/extensions/vscode/src/features/doctor.ts @@ -44,7 +44,7 @@ export async function activate(client: BaseLanguageClient) { const fileUri = doctorUri.with({ scheme: 'file', - path: doctorUri.path.substring(0, doctorUri.path.length - '/Doctor.md'.length), + path: doctorUri.path.slice(0, -'/Doctor.md'.length), }); const problems = await getProblems(fileUri); diff --git a/packages/component-meta/lib/base.ts b/packages/component-meta/lib/base.ts index 901dda662a..a749811c81 100644 --- a/packages/component-meta/lib/base.ts +++ b/packages/component-meta/lib/base.ts @@ -141,7 +141,7 @@ export function baseCreate( const globalTypesName = `${commandLine.vueOptions.lib}_${commandLine.vueOptions.target}_${commandLine.vueOptions.strictTemplates}.d.ts`; const globalTypesContents = `// @ts-nocheck\nexport {};\n` + vue.generateGlobalTypes(commandLine.vueOptions.lib, commandLine.vueOptions.target, commandLine.vueOptions.strictTemplates); const globalTypesSnapshot: ts.IScriptSnapshot = { - getText: (start, end) => globalTypesContents.substring(start, end), + getText: (start, end) => globalTypesContents.slice(start, end), getLength: () => globalTypesContents.length, getChangeRange: () => undefined, }; @@ -219,13 +219,13 @@ export function baseCreate( return ( commandLine.vueOptions.extensions.some(ext => fileName.endsWith(ext)) ? fileName - : fileName.substring(0, fileName.lastIndexOf('.')) + : fileName.slice(0, fileName.lastIndexOf('.')) ) + '.meta.ts'; } function getMetaScriptContent(fileName: string) { let code = ` -import * as Components from '${fileName.substring(0, fileName.length - '.meta.ts'.length)}'; +import * as Components from '${fileName.slice(0, -'.meta.ts'.length)}'; export default {} as { [K in keyof typeof Components]: ComponentMeta; }; interface ComponentMeta { @@ -335,7 +335,7 @@ ${commandLine.vueOptions.target < 3 ? vue2TypeHelpersCode : typeHelpersCode} ? (vueFile instanceof vue.VueVirtualCode ? readVueComponentDefaultProps(vueFile, printer, ts, commandLine.vueOptions) : {}) : {}; const tsDefaults = !vueFile ? readTsComponentDefaultProps( - componentPath.substring(componentPath.lastIndexOf('.') + 1), // ts | js | tsx | jsx + componentPath.slice(componentPath.lastIndexOf('.') + 1), // ts | js | tsx | jsx snapshot.getText(0, snapshot.getLength()), exportName, printer, @@ -726,7 +726,7 @@ function readVueComponentDefaultProps( if (descriptor.scriptSetup && scriptSetupRanges?.props.withDefaults?.arg) { - const defaultsText = descriptor.scriptSetup.content.substring(scriptSetupRanges.props.withDefaults.arg.start, scriptSetupRanges.props.withDefaults.arg.end); + const defaultsText = descriptor.scriptSetup.content.slice(scriptSetupRanges.props.withDefaults.arg.start, scriptSetupRanges.props.withDefaults.arg.end); const ast = ts.createSourceFile('/tmp.' + descriptor.scriptSetup.lang, '(' + defaultsText + ')', ts.ScriptTarget.Latest); const obj = findObjectLiteralExpression(ast); @@ -744,7 +744,7 @@ function readVueComponentDefaultProps( } } } else if (descriptor.scriptSetup && scriptSetupRanges?.props.define?.arg) { - const defaultsText = descriptor.scriptSetup.content.substring(scriptSetupRanges.props.define.arg.start, scriptSetupRanges.props.define.arg.end); + const defaultsText = descriptor.scriptSetup.content.slice(scriptSetupRanges.props.define.arg.start, scriptSetupRanges.props.define.arg.end); const ast = ts.createSourceFile('/tmp.' + descriptor.scriptSetup.lang, '(' + defaultsText + ')', ts.ScriptTarget.Latest); const obj = findObjectLiteralExpression(ast); diff --git a/packages/language-core/lib/codegen/script/componentSelf.ts b/packages/language-core/lib/codegen/script/componentSelf.ts index bfda805dc1..085697af3b 100644 --- a/packages/language-core/lib/codegen/script/componentSelf.ts +++ b/packages/language-core/lib/codegen/script/componentSelf.ts @@ -28,7 +28,7 @@ export function* generateComponentSelf( : ['', []] as const, ]) { for (const expose of bindings) { - const varName = content.substring(expose.start, expose.end); + const varName = content.slice(expose.start, expose.end); if (!templateUsageVars.has(varName) && !templateCodegenCtx.accessExternalVariables.has(varName)) { continue; } diff --git a/packages/language-core/lib/codegen/script/context.ts b/packages/language-core/lib/codegen/script/context.ts index a67d018de2..84434470fd 100644 --- a/packages/language-core/lib/codegen/script/context.ts +++ b/packages/language-core/lib/codegen/script/context.ts @@ -21,8 +21,8 @@ export function createScriptCodegenContext(options: ScriptCodegenOptions) { scriptSetupGeneratedOffset: undefined as number | undefined, bypassDefineComponent: options.lang === 'js' || options.lang === 'jsx', bindingNames: new Set([ - ...options.scriptRanges?.bindings.map(range => options.sfc.script!.content.substring(range.start, range.end)) ?? [], - ...options.scriptSetupRanges?.bindings.map(range => options.sfc.scriptSetup!.content.substring(range.start, range.end)) ?? [], + ...options.scriptRanges?.bindings.map(range => options.sfc.script!.content.slice(range.start, range.end)) ?? [], + ...options.scriptSetupRanges?.bindings.map(range => options.sfc.scriptSetup!.content.slice(range.start, range.end)) ?? [], ]), localTypes, inlayHints, diff --git a/packages/language-core/lib/codegen/script/scriptSetup.ts b/packages/language-core/lib/codegen/script/scriptSetup.ts index 491a4328ff..e8e319e39e 100644 --- a/packages/language-core/lib/codegen/script/scriptSetup.ts +++ b/packages/language-core/lib/codegen/script/scriptSetup.ts @@ -12,7 +12,7 @@ export function* generateScriptSetupImports( scriptSetupRanges: ScriptSetupRanges ): Generator { yield [ - scriptSetup.content.substring(0, Math.max(scriptSetupRanges.importSectionEndOffset, scriptSetupRanges.leadingCommentEndOffset)), + scriptSetup.content.slice(0, Math.max(scriptSetupRanges.importSectionEndOffset, scriptSetupRanges.leadingCommentEndOffset)), 'scriptSetup', 0, codeFeatures.all, @@ -524,5 +524,5 @@ function getRangeName( unwrap = false ) { const offset = unwrap ? 1 : 0; - return scriptSetup.content.substring(range.start + offset, range.end - offset); + return scriptSetup.content.slice(range.start + offset, range.end - offset); } \ No newline at end of file diff --git a/packages/language-core/lib/codegen/script/src.ts b/packages/language-core/lib/codegen/script/src.ts index 2c9aeb0dcb..350a4b44bf 100644 --- a/packages/language-core/lib/codegen/script/src.ts +++ b/packages/language-core/lib/codegen/script/src.ts @@ -7,13 +7,13 @@ export function* generateSrc( src: string ): Generator { if (src.endsWith('.d.ts')) { - src = src.substring(0, src.length - '.d.ts'.length); + src = src.slice(0, -'.d.ts'.length); } else if (src.endsWith('.ts')) { - src = src.substring(0, src.length - '.ts'.length); + src = src.slice(0, -'.ts'.length); } else if (src.endsWith('.tsx')) { - src = src.substring(0, src.length - '.tsx'.length) + '.jsx'; + src = src.slice(0, -'.tsx'.length) + '.jsx'; } if (!src.endsWith('.js') && !src.endsWith('.jsx')) { diff --git a/packages/language-core/lib/codegen/script/template.ts b/packages/language-core/lib/codegen/script/template.ts index 7cbaa2d227..a59c69b648 100644 --- a/packages/language-core/lib/codegen/script/template.ts +++ b/packages/language-core/lib/codegen/script/template.ts @@ -43,7 +43,7 @@ function* generateTemplateComponents(options: ScriptCodegenOptions): Generator { - const startTagOffset = node.loc.start.offset + options.template.content.substring(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; const tagOffsets = endTagOffset !== undefined && endTagOffset > startTagOffset @@ -283,7 +283,7 @@ export function* generateElement( componentCtxVar: string | undefined, isVForChild: boolean ): Generator { - const startTagOffset = node.loc.start.offset + options.template.content.substring(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; diff --git a/packages/language-core/lib/codegen/template/elementProps.ts b/packages/language-core/lib/codegen/template/elementProps.ts index 17c0ad0be6..b348c89eca 100644 --- a/packages/language-core/lib/codegen/template/elementProps.ts +++ b/packages/language-core/lib/codegen/template/elementProps.ts @@ -100,7 +100,7 @@ export function* generateElementProps( } if (prop.modifiers.some(m => m.content === 'prop' || m.content === 'attr')) { - propName = propName.substring(1); + propName = propName.slice(1); } const shouldSpread = propName === 'style' || propName === 'class'; diff --git a/packages/language-core/lib/codegen/template/interpolation.ts b/packages/language-core/lib/codegen/template/interpolation.ts index 57e87ec077..f03969daee 100644 --- a/packages/language-core/lib/codegen/template/interpolation.ts +++ b/packages/language-core/lib/codegen/template/interpolation.ts @@ -35,12 +35,12 @@ export function* generateInterpolation( let addSuffix = ''; const overLength = offset + section.length - _code.length; if (overLength > 0) { - addSuffix = section.substring(section.length - overLength); - section = section.substring(0, section.length - overLength); + addSuffix = section.slice(section.length - overLength); + section = section.slice(0, -overLength); } if (offset < 0) { - yield section.substring(0, -offset); - section = section.substring(-offset); + yield section.slice(0, -offset); + section = section.slice(-offset); offset = 0; } const shouldSkip = section.length === 0 && (type === 'startText' || type === 'endText'); @@ -117,11 +117,11 @@ export function* forEachInterpolationSegment( if (ctxVars.length) { if (ctxVars[0].isShorthand) { - yield [code.substring(0, ctxVars[0].offset + ctxVars[0].text.length), 0]; + yield [code.slice(0, ctxVars[0].offset + ctxVars[0].text.length), 0]; yield [': ', undefined]; } else if (ctxVars[0].offset > 0) { - yield [code.substring(0, ctxVars[0].offset), 0, 'startText']; + yield [code.slice(0, ctxVars[0].offset), 0, 'startText']; } for (let i = 0; i < ctxVars.length - 1; i++) { @@ -131,18 +131,18 @@ export function* forEachInterpolationSegment( yield* generateVar(code, destructuredPropNames, templateRefNames, curVar, nextVar); if (nextVar.isShorthand) { - yield [code.substring(curVar.offset + curVar.text.length, nextVar.offset + nextVar.text.length), curVar.offset + curVar.text.length]; + yield [code.slice(curVar.offset + curVar.text.length, nextVar.offset + nextVar.text.length), curVar.offset + curVar.text.length]; yield [': ', undefined]; } else { - yield [code.substring(curVar.offset + curVar.text.length, nextVar.offset), curVar.offset + curVar.text.length]; + yield [code.slice(curVar.offset + curVar.text.length, nextVar.offset), curVar.offset + curVar.text.length]; } } const lastVar = ctxVars.at(-1)!; yield* generateVar(code, destructuredPropNames, templateRefNames, lastVar); if (lastVar.offset + lastVar.text.length < code.length) { - yield [code.substring(lastVar.offset + lastVar.text.length), lastVar.offset + lastVar.text.length, 'endText']; + yield [code.slice(lastVar.offset + lastVar.text.length), lastVar.offset + lastVar.text.length, 'endText']; } } else { @@ -173,14 +173,14 @@ function* generateVar( const isTemplateRef = templateRefNames?.has(curVar.text) ?? false; if (isTemplateRef) { yield [`__VLS_unref(`, undefined]; - yield [code.substring(curVar.offset, curVar.offset + curVar.text.length), curVar.offset]; + yield [code.slice(curVar.offset, curVar.offset + curVar.text.length), curVar.offset]; yield [`)`, undefined]; } else { if (!isDestructuredProp) { yield [`__VLS_ctx.`, undefined]; } - yield [code.substring(curVar.offset, curVar.offset + curVar.text.length), curVar.offset]; + yield [code.slice(curVar.offset, curVar.offset + curVar.text.length), curVar.offset]; } } diff --git a/packages/language-core/lib/codegen/template/slotOutlet.ts b/packages/language-core/lib/codegen/template/slotOutlet.ts index f21d337ce6..a3908e90a5 100644 --- a/packages/language-core/lib/codegen/template/slotOutlet.ts +++ b/packages/language-core/lib/codegen/template/slotOutlet.ts @@ -15,7 +15,7 @@ export function* generateSlotOutlet( currentComponent: CompilerDOM.ElementNode | undefined, componentCtxVar: string | undefined ): Generator { - const startTagOffset = node.loc.start.offset + options.template.content.substring(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 varSlot = ctx.getInternalVariable(); const nameProp = node.props.find(prop => { if (prop.type === CompilerDOM.NodeTypes.ATTRIBUTE) { diff --git a/packages/language-core/lib/codegen/template/templateChild.ts b/packages/language-core/lib/codegen/template/templateChild.ts index e8ded97eb7..c0360c0867 100644 --- a/packages/language-core/lib/codegen/template/templateChild.ts +++ b/packages/language-core/lib/codegen/template/templateChild.ts @@ -194,11 +194,11 @@ export function parseInterpolationNode(node: CompilerDOM.InterpolationNode, temp let rightCharacter: string; // fix https://github.com/vuejs/language-tools/issues/1787 - while ((leftCharacter = template.substring(start - 1, start)).trim() === '' && leftCharacter.length) { + while ((leftCharacter = template.slice(start - 1, start)).trim() === '' && leftCharacter.length) { start--; content = leftCharacter + content; } - while ((rightCharacter = template.substring(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; } diff --git a/packages/language-core/lib/codegen/template/vFor.ts b/packages/language-core/lib/codegen/template/vFor.ts index 36c55692ac..c89104497d 100644 --- a/packages/language-core/lib/codegen/template/vFor.ts +++ b/packages/language-core/lib/codegen/template/vFor.ts @@ -105,7 +105,7 @@ export function parseVForNode(node: CompilerDOM.ForNode) { } : undefined; const leftExpressionText = leftExpressionRange - ? node.loc.source.substring( + ? node.loc.source.slice( leftExpressionRange.start - node.loc.start.offset, leftExpressionRange.end - node.loc.start.offset ) diff --git a/packages/language-core/lib/codegen/utils/index.ts b/packages/language-core/lib/codegen/utils/index.ts index b297524222..e404e73c9a 100644 --- a/packages/language-core/lib/codegen/utils/index.ts +++ b/packages/language-core/lib/codegen/utils/index.ts @@ -91,7 +91,7 @@ export function createTsAst(ts: typeof import('typescript'), astHolder: any, tex export function generateSfcBlockSection(block: SfcBlock, start: number, end: number, features: VueCodeInformation): Code { return [ - block.content.substring(start, end), + block.content.slice(start, end), block.name, start, features, diff --git a/packages/language-core/lib/languagePlugin.ts b/packages/language-core/lib/languagePlugin.ts index 8d6055f169..3cea8cc20f 100644 --- a/packages/language-core/lib/languagePlugin.ts +++ b/packages/language-core/lib/languagePlugin.ts @@ -119,7 +119,7 @@ export function createVueLanguagePlugin( getServiceScript(root) { for (const code of forEachEmbeddedCode(root)) { if (/script_(js|jsx|ts|tsx)/.test(code.id)) { - const lang = code.id.substring('script_'.length); + const lang = code.id.slice('script_'.length); return { code, extension: '.' + lang, diff --git a/packages/language-core/lib/parsers/scriptSetupRanges.ts b/packages/language-core/lib/parsers/scriptSetupRanges.ts index b020a7f24b..6e4f82e5c5 100644 --- a/packages/language-core/lib/parsers/scriptSetupRanges.ts +++ b/packages/language-core/lib/parsers/scriptSetupRanges.ts @@ -113,7 +113,7 @@ export function parseScriptSetupRanges( const templateRefNames = new Set(templateRefs.map(ref => ref.name)); bindings = bindings.filter(range => { - const name = text.substring(range.start, range.end); + const name = text.slice(range.start, range.end); return !templateRefNames.has(name); }); @@ -512,7 +512,7 @@ export function getNodeText( sourceFile: ts.SourceFile ) { const { start, end } = getStartEnd(ts, node, sourceFile); - return sourceFile.text.substring(start, end); + return sourceFile.text.slice(start, end); } function getStatementRange( diff --git a/packages/language-core/lib/plugins/file-html.ts b/packages/language-core/lib/plugins/file-html.ts index 036d6bf03b..2bb52b7d9e 100644 --- a/packages/language-core/lib/plugins/file-html.ts +++ b/packages/language-core/lib/plugins/file-html.ts @@ -81,7 +81,7 @@ const plugin: VueLanguagePlugin = ({ vueCompilerOptions }) => { }; } - templateContent = templateContent.substring(0, match.index) + ' '.repeat(matchText.length) + templateContent.substring(match.index + matchText.length); + templateContent = templateContent.slice(0, match.index) + ' '.repeat(matchText.length) + templateContent.slice(match.index + matchText.length); } sfc.descriptor.template = { diff --git a/packages/language-core/lib/plugins/file-md.ts b/packages/language-core/lib/plugins/file-md.ts index 3516476d8d..b3705ce88a 100644 --- a/packages/language-core/lib/plugins/file-md.ts +++ b/packages/language-core/lib/plugins/file-md.ts @@ -51,7 +51,7 @@ const plugin: VueLanguagePlugin = ({ vueCompilerOptions }) => { const matchText = match[0]; codes.push([matchText, undefined, match.index]); codes.push('\n\n'); - content = content.substring(0, match.index) + ' '.repeat(matchText.length) + content.substring(match.index + matchText.length); + content = content.slice(0, match.index) + ' '.repeat(matchText.length) + content.slice(match.index + matchText.length); } } diff --git a/packages/language-core/lib/plugins/file-vue.ts b/packages/language-core/lib/plugins/file-vue.ts index 476a44b015..441c4022a1 100644 --- a/packages/language-core/lib/plugins/file-vue.ts +++ b/packages/language-core/lib/plugins/file-vue.ts @@ -41,9 +41,9 @@ const plugin: VueLanguagePlugin = ({ vueCompilerOptions }) => { const oldContent = hitBlock.content; const newContent = hitBlock.content = - hitBlock.content.substring(0, change.start - hitBlock.loc.start.offset) + hitBlock.content.slice(0, change.start - hitBlock.loc.start.offset) + change.newText - + hitBlock.content.substring(change.end - hitBlock.loc.start.offset); + + hitBlock.content.slice(change.end - hitBlock.loc.start.offset); // #3449 const endTagRegex = new RegExp(``); diff --git a/packages/language-core/lib/plugins/vue-root-tags.ts b/packages/language-core/lib/plugins/vue-root-tags.ts index 2e9e5c56f0..d535bb93e4 100644 --- a/packages/language-core/lib/plugins/vue-root-tags.ts +++ b/packages/language-core/lib/plugins/vue-root-tags.ts @@ -42,7 +42,7 @@ const plugin: VueLanguagePlugin = () => { undefined, block.startTagEnd, block.endTagStart, - sfc.content.substring( + sfc.content.slice( block.startTagEnd, block.startTagEnd + offset ), @@ -52,7 +52,7 @@ const plugin: VueLanguagePlugin = () => { block.startTagEnd + offset, { structure: true }, ], - sfc.content.substring( + sfc.content.slice( block.startTagEnd + offset, block.endTagStart ) diff --git a/packages/language-core/lib/plugins/vue-template-html.ts b/packages/language-core/lib/plugins/vue-template-html.ts index e06a3a605b..8282a34c8f 100644 --- a/packages/language-core/lib/plugins/vue-template-html.ts +++ b/packages/language-core/lib/plugins/vue-template-html.ts @@ -202,9 +202,9 @@ const plugin: VueLanguagePlugin = ({ modules }) => { if (withinChangeRange(loc)) { loc.source = - loc.source.substring(0, change.start - loc.start.offset) + loc.source.slice(0, change.start - loc.start.offset) + change.newText - + loc.source.substring(change.end - loc.start.offset); + + loc.source.slice(change.end - loc.start.offset); (loc as any).__endOffset = loc.end.offset; loc.end.offset += lengthDiff; return true; diff --git a/packages/language-core/lib/plugins/vue-template-inline-css.ts b/packages/language-core/lib/plugins/vue-template-inline-css.ts index cd285bf75a..79c13f93ec 100644 --- a/packages/language-core/lib/plugins/vue-template-inline-css.ts +++ b/packages/language-core/lib/plugins/vue-template-inline-css.ts @@ -48,7 +48,7 @@ function* generate(templateAst: NonNullable): Generator { const start = leftExpressionRange.start; const end = source.loc.start.offset + source.content.length; addFormatCodes( - templateContent.substring(start, end), + templateContent.slice(start, end), start, formatBrackets.for ); diff --git a/packages/language-core/lib/plugins/vue-tsx.ts b/packages/language-core/lib/plugins/vue-tsx.ts index 9e2e4b9d97..a6d29e9682 100644 --- a/packages/language-core/lib/plugins/vue-tsx.ts +++ b/packages/language-core/lib/plugins/vue-tsx.ts @@ -129,7 +129,7 @@ function createTsx( const bindings = scriptSetupRanges.get()?.bindings; if (_sfc.scriptSetup && bindings) { for (const binding of bindings) { - newNames.add(_sfc.scriptSetup?.content.substring(binding.start, binding.end)); + newNames.add(_sfc.scriptSetup?.content.slice(binding.start, binding.end)); } } if (newNames && oldNames && twoSetsEqual(newNames, oldNames)) { diff --git a/packages/language-server/lib/initialize.ts b/packages/language-server/lib/initialize.ts index 4a2a02e97c..88c5c626f1 100644 --- a/packages/language-server/lib/initialize.ts +++ b/packages/language-server/lib/initialize.ts @@ -58,7 +58,7 @@ export function initialize( const globalTypesName = `${vueCompilerOptions.lib}_${vueCompilerOptions.target}_${vueCompilerOptions.strictTemplates}.d.ts`; const globalTypesContents = `// @ts-nocheck\nexport {};\n` + generateGlobalTypes(vueCompilerOptions.lib, vueCompilerOptions.target, vueCompilerOptions.strictTemplates); const globalTypesSnapshot: ts.IScriptSnapshot = { - getText: (start, end) => globalTypesContents.substring(start, end), + getText: (start, end) => globalTypesContents.slice(start, end), getLength: () => globalTypesContents.length, getChangeRange: () => undefined, }; diff --git a/packages/language-service/lib/plugins/vue-autoinsert-dotvalue.ts b/packages/language-service/lib/plugins/vue-autoinsert-dotvalue.ts index 43e0bf854c..3c07c84f23 100644 --- a/packages/language-service/lib/plugins/vue-autoinsert-dotvalue.ts +++ b/packages/language-service/lib/plugins/vue-autoinsert-dotvalue.ts @@ -124,7 +124,7 @@ const charReg = /\w/; export function isCharacterTyping(document: TextDocument, change: { text: string; rangeOffset: number; rangeLength: number; }) { const lastCharacter = change.text[change.text.length - 1]; - const nextCharacter = document.getText().substring( + const nextCharacter = document.getText().slice( change.rangeOffset + change.text.length, change.rangeOffset + change.text.length + 1 ); diff --git a/packages/language-service/lib/plugins/vue-autoinsert-space.ts b/packages/language-service/lib/plugins/vue-autoinsert-space.ts index 8c23035663..4ff7c0de91 100644 --- a/packages/language-service/lib/plugins/vue-autoinsert-space.ts +++ b/packages/language-service/lib/plugins/vue-autoinsert-space.ts @@ -22,7 +22,7 @@ export function create(): LanguageServicePlugin { if ( change.text === '{}' - && document.getText().substring(change.rangeOffset - 1, change.rangeOffset + 3) === '{{}}' + && document.getText().slice(change.rangeOffset - 1, change.rangeOffset + 3) === '{{}}' && document.offsetAt(selection) === change.rangeOffset + 1 ) { return ` $0 `; diff --git a/packages/language-service/lib/plugins/vue-directive-comments.ts b/packages/language-service/lib/plugins/vue-directive-comments.ts index 17b70b1077..c695d02644 100644 --- a/packages/language-service/lib/plugins/vue-directive-comments.ts +++ b/packages/language-service/lib/plugins/vue-directive-comments.ts @@ -33,7 +33,7 @@ export function create(): LanguageServicePlugin { } const startIndex = cmdStart.index! + cmdStart[0].length; - const remainText = line.substring(startIndex); + const remainText = line.slice(startIndex); const result: CompletionItem[] = []; for (const [label, text = label] of cmds) { diff --git a/packages/language-service/lib/plugins/vue-document-drop.ts b/packages/language-service/lib/plugins/vue-document-drop.ts index 7b0e3cfcb3..a6aa6b220b 100644 --- a/packages/language-service/lib/plugins/vue-document-drop.ts +++ b/packages/language-service/lib/plugins/vue-document-drop.ts @@ -51,8 +51,8 @@ export function create( return; } - let baseName = importUri.substring(importUri.lastIndexOf('/') + 1); - baseName = baseName.substring(0, baseName.lastIndexOf('.')); + let baseName = importUri.slice(importUri.lastIndexOf('/') + 1); + baseName = baseName.slice(0, baseName.lastIndexOf('.')); const newName = capitalize(camelize(baseName)); const { _sfc: sfc } = vueVirtualCode; @@ -83,7 +83,7 @@ export function create( if (!importPath) { importPath = path.relative(path.dirname(vueVirtualCode.fileName), incomingFileName) - || importUri.substring(importUri.lastIndexOf('/') + 1); + || importUri.slice(importUri.lastIndexOf('/') + 1); if (!importPath.startsWith('./') && !importPath.startsWith('../')) { importPath = './' + importPath; diff --git a/packages/language-service/lib/plugins/vue-document-links.ts b/packages/language-service/lib/plugins/vue-document-links.ts index 6bab96528a..23947e09ac 100644 --- a/packages/language-service/lib/plugins/vue-document-links.ts +++ b/packages/language-service/lib/plugins/vue-document-links.ts @@ -33,10 +33,10 @@ export function create(): LanguageServicePlugin { const style = sourceScript.generated.root._sfc.styles[i]; if (option === 'always' || (option === 'scoped' && style.scoped)) { for (const className of style.classNames) { - if (!styleClasses.has(className.text.substring(1))) { - styleClasses.set(className.text.substring(1), []); + if (!styleClasses.has(className.text.slice(1))) { + styleClasses.set(className.text.slice(1), []); } - styleClasses.get(className.text.substring(1))!.push({ + styleClasses.get(className.text.slice(1))!.push({ index: i, style, classOffset: className.offset, diff --git a/packages/language-service/lib/plugins/vue-extract-file.ts b/packages/language-service/lib/plugins/vue-extract-file.ts index 4cfaab82b6..de17245580 100644 --- a/packages/language-service/lib/plugins/vue-extract-file.ts +++ b/packages/language-service/lib/plugins/vue-extract-file.ts @@ -100,13 +100,13 @@ export function create( const templateInitialIndent = await context.env.getConfiguration!('vue.format.template.initialIndent') ?? true; const scriptInitialIndent = await context.env.getConfiguration!('vue.format.script.initialIndent') ?? false; - const newUri = sfcDocument.uri.substring(0, sfcDocument.uri.lastIndexOf('/') + 1) + `${newName}.vue`; + const newUri = sfcDocument.uri.slice(0, sfcDocument.uri.lastIndexOf('/') + 1) + `${newName}.vue`; const lastImportNode = getLastImportNode(ts, script.ast); let newFileTags = []; newFileTags.push( - constructTag('template', [], templateInitialIndent, sfc.template.content.substring(templateCodeRange[0], templateCodeRange[1])) + constructTag('template', [], templateInitialIndent, sfc.template.content.slice(templateCodeRange[0], templateCodeRange[1])) ); if (toExtract.length) { diff --git a/packages/language-service/lib/plugins/vue-template.ts b/packages/language-service/lib/plugins/vue-template.ts index 78f7d7b11a..3bc7be5a94 100644 --- a/packages/language-service/lib/plugins/vue-template.ts +++ b/packages/language-service/lib/plugins/vue-template.ts @@ -106,7 +106,7 @@ export function create( .split('\n- ')[4] .split('\n').slice(2, -1); for (let text of modifiers) { - text = text.substring(' - `.'.length); + text = text.slice(' - `.'.length); const [name, disc] = text.split('` - '); eventModifiers[name] = disc; } @@ -117,7 +117,7 @@ export function create( .split('\n- ')[4] .split('\n').slice(2, -1); for (let text of modifiers) { - text = text.substring(' - `.'.length); + text = text.slice(' - `.'.length); const [name, disc] = text.split('` - '); propModifiers[name] = disc; } @@ -252,19 +252,19 @@ export function create( } // normalize if (attrText.startsWith('v-bind:')) { - attrText = attrText.substring('v-bind:'.length); + attrText = attrText.slice('v-bind:'.length); } else if (attrText.startsWith(':')) { - attrText = attrText.substring(':'.length); + attrText = attrText.slice(':'.length); } else if (attrText.startsWith('v-model:')) { - attrText = attrText.substring('v-model:'.length); + attrText = attrText.slice('v-model:'.length); } else if (attrText === 'v-model') { attrText = vueCompilerOptions.target >= 3 ? 'modelValue' : 'value'; // TODO: support for experimentalModelPropName? } else if (attrText.startsWith('@')) { - attrText = 'on-' + hyphenateAttr(attrText.substring('@'.length)); + attrText = 'on-' + hyphenateAttr(attrText.slice('@'.length)); } current.unburnedRequiredProps = current.unburnedRequiredProps.filter(propName => { @@ -501,7 +501,7 @@ export function create( } for (const binding of scriptSetupRanges?.bindings ?? []) { - const name = vueCode._sfc.scriptSetup!.content.substring(binding.start, binding.end); + const name = vueCode._sfc.scriptSetup!.content.slice(binding.start, binding.end); if (casing.tag === TagNameCasing.Kebab) { names.add(hyphenateTag(name)); } @@ -553,8 +553,8 @@ export function create( return []; } let ctxVars = [ - ..._tsCodegen.scriptRanges.get()?.bindings.map(binding => vueCode._sfc.script!.content.substring(binding.start, binding.end)) ?? [], - ..._tsCodegen.scriptSetupRanges.get()?.bindings.map(binding => vueCode._sfc.scriptSetup!.content.substring(binding.start, binding.end)) ?? [], + ..._tsCodegen.scriptRanges.get()?.bindings.map(binding => vueCode._sfc.script!.content.slice(binding.start, binding.end)) ?? [], + ..._tsCodegen.scriptSetupRanges.get()?.bindings.map(binding => vueCode._sfc.scriptSetup!.content.slice(binding.start, binding.end)) ?? [], ...templateContextProps, ]; ctxVars = [...new Set(ctxVars)]; @@ -647,12 +647,12 @@ export function create( for (const prop of [...props, ...attrs]) { if (prop.startsWith('onUpdate:')) { const isGlobal = !propsSet.has(prop); - models.push([isGlobal, prop.substring('onUpdate:'.length)]); + models.push([isGlobal, prop.slice('onUpdate:'.length)]); } } for (const event of events) { if (event.startsWith('update:')) { - models.push([false, event.substring('update:'.length)]); + models.push([false, event.slice('update:'.length)]); } } From ad85444b34e2af2b15c666d248001a8a754824c5 Mon Sep 17 00:00:00 2001 From: KazariEX <1364035137@qq.com> Date: Sat, 2 Nov 2024 21:19:29 +0800 Subject: [PATCH 008/345] fix(language-core): copy destructured props instead of referencing --- packages/language-core/lib/plugins/vue-tsx.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/language-core/lib/plugins/vue-tsx.ts b/packages/language-core/lib/plugins/vue-tsx.ts index a6d29e9682..c7e4db53e9 100644 --- a/packages/language-core/lib/plugins/vue-tsx.ts +++ b/packages/language-core/lib/plugins/vue-tsx.ts @@ -145,7 +145,7 @@ function createTsx( return newNames; }); const destructuredPropNames = computed>(oldNames => { - const newNames = scriptSetupRanges.get()?.props.destructured ?? new Set(); + const newNames = new Set(scriptSetupRanges.get()?.props.destructured); const rest = scriptSetupRanges.get()?.props.destructuredRest; if (rest) { newNames.add(rest); From bdb77c4ef53168bfeaa2bb97b053f35c846dfc43 Mon Sep 17 00:00:00 2001 From: KazariEX <1364035137@qq.com> Date: Sat, 2 Nov 2024 21:24:36 +0800 Subject: [PATCH 009/345] refactor(language-core): use `Unstable.computedSet` --- packages/language-core/lib/plugins/vue-tsx.ts | 92 ++++++++----------- 1 file changed, 38 insertions(+), 54 deletions(-) diff --git a/packages/language-core/lib/plugins/vue-tsx.ts b/packages/language-core/lib/plugins/vue-tsx.ts index c7e4db53e9..d578f9ce35 100644 --- a/packages/language-core/lib/plugins/vue-tsx.ts +++ b/packages/language-core/lib/plugins/vue-tsx.ts @@ -1,5 +1,5 @@ import type { Mapping } from '@volar/language-core'; -import { computed } from 'alien-signals'; +import { computed, Unstable } from 'alien-signals'; import { generateScript } from '../codegen/script'; import { generateTemplate } from '../codegen/template'; import { parseScriptRanges } from '../parsers/scriptRanges'; @@ -124,48 +124,44 @@ function createTsx( codes: codes, }; }); - const scriptSetupBindingNames = computed>(oldNames => { - const newNames = new Set(); - const bindings = scriptSetupRanges.get()?.bindings; - if (_sfc.scriptSetup && bindings) { - for (const binding of bindings) { - newNames.add(_sfc.scriptSetup?.content.slice(binding.start, binding.end)); + const scriptSetupBindingNames = Unstable.computedSet( + computed(() => { + const newNames = new Set(); + const bindings = scriptSetupRanges.get()?.bindings; + if (_sfc.scriptSetup && bindings) { + for (const binding of bindings) { + newNames.add(_sfc.scriptSetup?.content.slice(binding.start, binding.end)); + } } - } - if (newNames && oldNames && twoSetsEqual(newNames, oldNames)) { - return oldNames; - } - return newNames; - }); - const scriptSetupImportComponentNames = computed>(oldNames => { - const newNames = scriptSetupRanges.get()?.importComponentNames ?? new Set(); - if (oldNames && twoSetsEqual(newNames, oldNames)) { - return oldNames; - } - return newNames; - }); - const destructuredPropNames = computed>(oldNames => { - const newNames = new Set(scriptSetupRanges.get()?.props.destructured); - const rest = scriptSetupRanges.get()?.props.destructuredRest; - if (rest) { - newNames.add(rest); - } - if (oldNames && twoSetsEqual(newNames, oldNames)) { - return oldNames; - } - return newNames; - }); - const templateRefNames = computed>(oldNames => { - const newNames = new Set( - scriptSetupRanges.get()?.templateRefs - .map(({ name }) => name) - .filter(name => name !== undefined) - ); - if (oldNames && twoSetsEqual(newNames, oldNames)) { - return oldNames; - } - return newNames; - }); + return newNames; + }) + ); + const scriptSetupImportComponentNames = Unstable.computedSet( + computed(() => { + const newNames = scriptSetupRanges.get()?.importComponentNames ?? new Set(); + return newNames; + }) + ); + const destructuredPropNames = Unstable.computedSet( + computed(() => { + const newNames = new Set(scriptSetupRanges.get()?.props.destructured); + const rest = scriptSetupRanges.get()?.props.destructuredRest; + if (rest) { + newNames.add(rest); + } + return newNames; + }) + ); + const templateRefNames = Unstable.computedSet( + computed(() => { + const newNames = new Set( + scriptSetupRanges.get()?.templateRefs + .map(({ name }) => name) + .filter(name => name !== undefined) + ); + return newNames; + }) + ); const hasDefineSlots = computed(() => !!scriptSetupRanges.get()?.slots.define); const slotsAssignName = computed(() => scriptSetupRanges.get()?.slots.name); const propsAssignName = computed(() => scriptSetupRanges.get()?.props.name); @@ -220,15 +216,3 @@ function createTsx( generatedTemplate, }; } - -function twoSetsEqual(a: Set, b: Set) { - if (a.size !== b.size) { - return false; - } - for (const file of a) { - if (!b.has(file)) { - return false; - } - } - return true; -} From f991c11f80b73a53e6e48ea77955483c4ce5bfad Mon Sep 17 00:00:00 2001 From: KazariEX <1364035137@qq.com> Date: Sat, 2 Nov 2024 21:48:13 +0800 Subject: [PATCH 010/345] refactor(language-core): clearer params passing and calling of `generateInterpolation` --- .../language-core/lib/codegen/script/index.ts | 8 +- .../lib/codegen/script/template.ts | 30 ++----- .../lib/codegen/template/element.ts | 17 ++-- .../lib/codegen/template/elementDirectives.ts | 10 ++- .../lib/codegen/template/elementEvents.ts | 7 +- .../lib/codegen/template/elementProps.ts | 10 ++- .../lib/codegen/template/interpolation.ts | 20 +++-- .../lib/codegen/template/objectProperty.ts | 15 +++- .../lib/codegen/template/propertyAccess.ts | 7 +- .../lib/codegen/template/slotOutlet.ts | 5 +- .../lib/codegen/template/templateChild.ts | 5 +- .../lib/codegen/template/vFor.ts | 10 ++- .../language-core/lib/codegen/template/vIf.ts | 5 +- packages/language-core/lib/plugins/vue-tsx.ts | 82 ++++++++++--------- 14 files changed, 122 insertions(+), 109 deletions(-) diff --git a/packages/language-core/lib/codegen/script/index.ts b/packages/language-core/lib/codegen/script/index.ts index fe32d786cc..d805ec1ef3 100644 --- a/packages/language-core/lib/codegen/script/index.ts +++ b/packages/language-core/lib/codegen/script/index.ts @@ -38,19 +38,21 @@ export const codeFeatures = { }; export interface ScriptCodegenOptions { - fileName: string; ts: typeof ts; compilerOptions: ts.CompilerOptions; vueCompilerOptions: VueCompilerOptions; sfc: Sfc; + edited: boolean; + fileName: string; lang: string; scriptRanges: ScriptRanges | undefined; scriptSetupRanges: ScriptSetupRanges | undefined; templateCodegen: TemplateCodegenContext & { codes: Code[]; } | undefined; - edited: boolean; - appendGlobalTypes: boolean; + destructuredPropNames: Set; + templateRefNames: Set; getGeneratedLength: () => number; linkedCodeMappings: Mapping[]; + appendGlobalTypes: boolean; } export function* generateScript(options: ScriptCodegenOptions): Generator { diff --git a/packages/language-core/lib/codegen/script/template.ts b/packages/language-core/lib/codegen/script/template.ts index a59c69b648..b9524dbd66 100644 --- a/packages/language-core/lib/codegen/script/template.ts +++ b/packages/language-core/lib/codegen/script/template.ts @@ -1,9 +1,8 @@ import * as path from 'path-browserify'; -import type * as ts from 'typescript'; import type { Code } from '../../types'; import { getSlotsPropertyName, hyphenateTag } from '../../utils/shared'; import { TemplateCodegenContext, createTemplateCodegenContext } from '../template/context'; -import { forEachInterpolationSegment } from '../template/interpolation'; +import { generateInterpolation } from '../template/interpolation'; import { generateStyleScopedClasses } from '../template/styleScopedClasses'; import { endOfLine, newLine } from '../utils'; import type { ScriptCodegenContext } from './context'; @@ -221,29 +220,14 @@ function* generateCssVars(options: ScriptCodegenOptions, ctx: TemplateCodegenCon yield `// CSS variable injection ${newLine}`; for (const style of options.sfc.styles) { for (const cssBind of style.cssVars) { - for (const [segment, offset, onlyError] of forEachInterpolationSegment( - options.ts, - undefined, - undefined, + yield* generateInterpolation( + options, ctx, + style.name, + codeFeatures.all, cssBind.text, - cssBind.offset, - options.ts.createSourceFile('/a.txt', cssBind.text, 99 satisfies ts.ScriptTarget.ESNext) - )) { - if (offset === undefined) { - yield segment; - } - else { - yield [ - segment, - style.name, - cssBind.offset + offset, - onlyError - ? codeFeatures.navigation - : codeFeatures.all, - ]; - } - } + cssBind.offset + ); yield endOfLine; } } diff --git a/packages/language-core/lib/codegen/template/element.ts b/packages/language-core/lib/codegen/template/element.ts index 9546d7a08d..9e77166580 100644 --- a/packages/language-core/lib/codegen/template/element.ts +++ b/packages/language-core/lib/codegen/template/element.ts @@ -116,10 +116,11 @@ export function* generateComponent( yield* generateInterpolation( options, ctx, + 'template', + ctx.codeFeatures.all, dynamicTagInfo.tag, - dynamicTagInfo.astHolder, dynamicTagInfo.offsets[0], - ctx.codeFeatures.all, + dynamicTagInfo.astHolder, '(', ')' ); @@ -128,13 +129,14 @@ export function* generateComponent( yield* generateInterpolation( options, ctx, - dynamicTagInfo.tag, - dynamicTagInfo.astHolder, - dynamicTagInfo.offsets[1], + 'template', { ...ctx.codeFeatures.all, completion: false, }, + dynamicTagInfo.tag, + dynamicTagInfo.offsets[1], + dynamicTagInfo.astHolder, '(', ')' ); @@ -360,10 +362,11 @@ function* generateFailedPropExps( yield* generateInterpolation( options, ctx, + 'template', + ctx.codeFeatures.all, failedExp.node.loc.source, - failedExp.node.loc, failedExp.node.loc.start.offset, - ctx.codeFeatures.all, + failedExp.node.loc, failedExp.prefix, failedExp.suffix ); diff --git a/packages/language-core/lib/codegen/template/elementDirectives.ts b/packages/language-core/lib/codegen/template/elementDirectives.ts index d1953baf67..fa76122c0e 100644 --- a/packages/language-core/lib/codegen/template/elementDirectives.ts +++ b/packages/language-core/lib/codegen/template/elementDirectives.ts @@ -105,10 +105,11 @@ function* generateArg( yield* generateInterpolation( options, ctx, + 'template', + ctx.codeFeatures.all, arg.content, - arg.loc, startOffset, - ctx.codeFeatures.all, + arg.loc, '(', ')' ); @@ -162,10 +163,11 @@ function* generateValue( ...generateInterpolation( options, ctx, + 'template', + ctx.codeFeatures.all, prop.exp.content, - prop.exp.loc, prop.exp.loc.start.offset, - ctx.codeFeatures.all, + prop.exp.loc, '(', ')' ) diff --git a/packages/language-core/lib/codegen/template/elementEvents.ts b/packages/language-core/lib/codegen/template/elementEvents.ts index 2184c7aa3e..a8aa061084 100644 --- a/packages/language-core/lib/codegen/template/elementEvents.ts +++ b/packages/language-core/lib/codegen/template/elementEvents.ts @@ -148,9 +148,7 @@ export function* generateEventExpression( yield* generateInterpolation( options, ctx, - prop.exp.content, - prop.exp.loc, - prop.exp.loc.start.offset, + 'template', offset => { if (_isCompoundExpression && isFirstMapping) { isFirstMapping = false; @@ -169,6 +167,9 @@ export function* generateEventExpression( } return ctx.codeFeatures.all; }, + prop.exp.content, + prop.exp.loc.start.offset, + prop.exp.loc, prefix, suffix ); diff --git a/packages/language-core/lib/codegen/template/elementProps.ts b/packages/language-core/lib/codegen/template/elementProps.ts index b348c89eca..66ff31cc33 100644 --- a/packages/language-core/lib/codegen/template/elementProps.ts +++ b/packages/language-core/lib/codegen/template/elementProps.ts @@ -228,10 +228,11 @@ export function* generateElementProps( ...generateInterpolation( options, ctx, + 'template', + ctx.codeFeatures.all, prop.exp.content, - prop.exp.loc, prop.exp.loc.start.offset, - ctx.codeFeatures.all, + prop.exp.loc, '(', ')' ) @@ -296,10 +297,11 @@ function* generatePropExp( yield* generateInterpolation( options, ctx, + 'template', + features, exp.loc.source, - exp.loc, exp.loc.start.offset, - features, + exp.loc, '(', ')' ); diff --git a/packages/language-core/lib/codegen/template/interpolation.ts b/packages/language-core/lib/codegen/template/interpolation.ts index f03969daee..64fb39d916 100644 --- a/packages/language-core/lib/codegen/template/interpolation.ts +++ b/packages/language-core/lib/codegen/template/interpolation.ts @@ -4,17 +4,21 @@ import { getNodeText, getStartEnd } from '../../parsers/scriptSetupRanges'; import type { Code, VueCodeInformation } from '../../types'; import { collectVars, createTsAst } from '../utils'; import type { TemplateCodegenContext } from './context'; -import type { TemplateCodegenOptions } from './index'; export function* generateInterpolation( - options: TemplateCodegenOptions, + options: { + ts: typeof import('typescript'), + destructuredPropNames: Set | undefined, + templateRefNames: Set | undefined + }, ctx: TemplateCodegenContext, + source: string, + data: VueCodeInformation | ((offset: number) => VueCodeInformation) | undefined, _code: string, - astHolder: any, start: number | undefined, - data: VueCodeInformation | ((offset: number) => VueCodeInformation) | undefined, - prefix: string, - suffix: string + astHolder: any = {}, + prefix: string = '', + suffix: string = '' ): Generator { const code = prefix + _code + suffix; const ast = createTsAst(options.ts, astHolder, code); @@ -51,7 +55,7 @@ export function* generateInterpolation( ) { yield [ section, - 'template', + source, start + offset, type === 'errorMappingOnly' ? ctx.codeFeatures.verification @@ -67,7 +71,7 @@ export function* generateInterpolation( } } -export function* forEachInterpolationSegment( +function* forEachInterpolationSegment( ts: typeof import('typescript'), destructuredPropNames: Set | undefined, templateRefNames: Set | undefined, diff --git a/packages/language-core/lib/codegen/template/objectProperty.ts b/packages/language-core/lib/codegen/template/objectProperty.ts index cea9ebe045..78df1a85c6 100644 --- a/packages/language-core/lib/codegen/template/objectProperty.ts +++ b/packages/language-core/lib/codegen/template/objectProperty.ts @@ -22,16 +22,25 @@ export function* generateObjectProperty( yield* generateInterpolation( options, ctx, + 'template', + features, code.slice(1, -1), - astHolder, offset + 1, - features, + astHolder, `[__VLS_tryAsConstant(`, `)]` ); } else { - yield* generateInterpolation(options, ctx, code, astHolder, offset, features, '', ''); + yield* generateInterpolation( + options, + ctx, + 'template', + features, + code, + offset, + astHolder + ); } } else if (shouldCamelize) { diff --git a/packages/language-core/lib/codegen/template/propertyAccess.ts b/packages/language-core/lib/codegen/template/propertyAccess.ts index 0b4c500d6a..0733d38b01 100644 --- a/packages/language-core/lib/codegen/template/propertyAccess.ts +++ b/packages/language-core/lib/codegen/template/propertyAccess.ts @@ -23,12 +23,11 @@ export function* generatePropertyAccess( yield* generateInterpolation( options, ctx, + 'template', + features, code, - astHolder, offset, - features, - '', - '' + astHolder ); } else { diff --git a/packages/language-core/lib/codegen/template/slotOutlet.ts b/packages/language-core/lib/codegen/template/slotOutlet.ts index a3908e90a5..632ffc056e 100644 --- a/packages/language-core/lib/codegen/template/slotOutlet.ts +++ b/packages/language-core/lib/codegen/template/slotOutlet.ts @@ -90,10 +90,11 @@ export function* generateSlotOutlet( yield* generateInterpolation( options, ctx, + 'template', + ctx.codeFeatures.all, nameProp.exp.content, - nameProp.exp, nameProp.exp.loc.start.offset, - ctx.codeFeatures.all, + nameProp.exp, '(', ')' ); diff --git a/packages/language-core/lib/codegen/template/templateChild.ts b/packages/language-core/lib/codegen/template/templateChild.ts index c0360c0867..ab099bdb43 100644 --- a/packages/language-core/lib/codegen/template/templateChild.ts +++ b/packages/language-core/lib/codegen/template/templateChild.ts @@ -118,10 +118,11 @@ export function* generateTemplateChild( yield* generateInterpolation( options, ctx, + 'template', + ctx.codeFeatures.all, content, - node.content.loc, start, - ctx.codeFeatures.all, + node.content.loc, `(`, `)${endOfLine}` ); diff --git a/packages/language-core/lib/codegen/template/vFor.ts b/packages/language-core/lib/codegen/template/vFor.ts index c89104497d..0d9a0c35eb 100644 --- a/packages/language-core/lib/codegen/template/vFor.ts +++ b/packages/language-core/lib/codegen/template/vFor.ts @@ -34,10 +34,11 @@ export function* generateVFor( yield* generateInterpolation( options, ctx, + 'template', + ctx.codeFeatures.all, source.content, - source.loc, source.loc.start.offset, - ctx.codeFeatures.all, + source.loc, '(', ')' ); @@ -69,10 +70,11 @@ export function* generateVFor( yield* generateInterpolation( options, ctx, + 'template', + ctx.codeFeatures.all, prop.value.content, - prop.value.loc, prop.value.loc.start.offset, - ctx.codeFeatures.all, + prop.value.loc, '(', ')' ); diff --git a/packages/language-core/lib/codegen/template/vIf.ts b/packages/language-core/lib/codegen/template/vIf.ts index 1a73d2fccd..9f1714d290 100644 --- a/packages/language-core/lib/codegen/template/vIf.ts +++ b/packages/language-core/lib/codegen/template/vIf.ts @@ -38,10 +38,11 @@ export function* generateVIf( ...generateInterpolation( options, ctx, + 'template', + ctx.codeFeatures.all, branch.condition.content, - branch.condition.loc, branch.condition.loc.start.offset, - ctx.codeFeatures.all, + branch.condition.loc, '(', ')' ), diff --git a/packages/language-core/lib/plugins/vue-tsx.ts b/packages/language-core/lib/plugins/vue-tsx.ts index d578f9ce35..528df79ad1 100644 --- a/packages/language-core/lib/plugins/vue-tsx.ts +++ b/packages/language-core/lib/plugins/vue-tsx.ts @@ -88,42 +88,6 @@ function createTsx( ? parseScriptSetupRanges(ts, _sfc.scriptSetup.ast, ctx.vueCompilerOptions) : undefined ); - const generatedTemplate = computed(() => { - - if (ctx.vueCompilerOptions.skipTemplateCodegen || !_sfc.template) { - return; - } - - const codes: Code[] = []; - const codegen = generateTemplate({ - ts, - compilerOptions: ctx.compilerOptions, - vueCompilerOptions: ctx.vueCompilerOptions, - template: _sfc.template, - edited: ctx.vueCompilerOptions.__test || (fileEditTimes.get(fileName) ?? 0) >= 2, - scriptSetupBindingNames: scriptSetupBindingNames.get(), - scriptSetupImportComponentNames: scriptSetupImportComponentNames.get(), - destructuredPropNames: destructuredPropNames.get(), - templateRefNames: templateRefNames.get(), - hasDefineSlots: hasDefineSlots.get(), - slotsAssignName: slotsAssignName.get(), - propsAssignName: propsAssignName.get(), - inheritAttrs: inheritAttrs.get(), - }); - - let current = codegen.next(); - - while (!current.done) { - const code = current.value; - codes.push(code); - current = codegen.next(); - } - - return { - ...current.value, - codes: codes, - }; - }); const scriptSetupBindingNames = Unstable.computedSet( computed(() => { const newNames = new Set(); @@ -169,21 +133,59 @@ function createTsx( const value = scriptSetupRanges.get()?.options.inheritAttrs ?? scriptRanges.get()?.exportDefault?.inheritAttrsOption; return value !== 'false'; }); + const generatedTemplate = computed(() => { + + if (ctx.vueCompilerOptions.skipTemplateCodegen || !_sfc.template) { + return; + } + + const codes: Code[] = []; + const codegen = generateTemplate({ + ts, + compilerOptions: ctx.compilerOptions, + vueCompilerOptions: ctx.vueCompilerOptions, + template: _sfc.template, + edited: ctx.vueCompilerOptions.__test || (fileEditTimes.get(fileName) ?? 0) >= 2, + scriptSetupBindingNames: scriptSetupBindingNames.get(), + scriptSetupImportComponentNames: scriptSetupImportComponentNames.get(), + destructuredPropNames: destructuredPropNames.get(), + templateRefNames: templateRefNames.get(), + hasDefineSlots: hasDefineSlots.get(), + slotsAssignName: slotsAssignName.get(), + propsAssignName: propsAssignName.get(), + inheritAttrs: inheritAttrs.get(), + }); + + let current = codegen.next(); + + while (!current.done) { + const code = current.value; + codes.push(code); + current = codegen.next(); + } + + return { + ...current.value, + codes: codes, + }; + }); const generatedScript = computed(() => { const codes: Code[] = []; const linkedCodeMappings: Mapping[] = []; let generatedLength = 0; const codegen = generateScript({ ts, - fileName, + compilerOptions: ctx.compilerOptions, + vueCompilerOptions: ctx.vueCompilerOptions, sfc: _sfc, + edited: ctx.vueCompilerOptions.__test || (fileEditTimes.get(fileName) ?? 0) >= 2, + fileName, lang: lang.get(), scriptRanges: scriptRanges.get(), scriptSetupRanges: scriptSetupRanges.get(), templateCodegen: generatedTemplate.get(), - compilerOptions: ctx.compilerOptions, - vueCompilerOptions: ctx.vueCompilerOptions, - edited: ctx.vueCompilerOptions.__test || (fileEditTimes.get(fileName) ?? 0) >= 2, + destructuredPropNames: destructuredPropNames.get(), + templateRefNames: templateRefNames.get(), getGeneratedLength: () => generatedLength, linkedCodeMappings, appendGlobalTypes, From e9ca6502903237b191fd18de9ebbe3b3c526c09f Mon Sep 17 00:00:00 2001 From: KazariEX <1364035137@qq.com> Date: Sat, 2 Nov 2024 22:34:32 +0800 Subject: [PATCH 011/345] fix(language-core): should not skip `v-generic` --- packages/language-core/lib/codegen/template/elementDirectives.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/language-core/lib/codegen/template/elementDirectives.ts b/packages/language-core/lib/codegen/template/elementDirectives.ts index fa76122c0e..831bfe901a 100644 --- a/packages/language-core/lib/codegen/template/elementDirectives.ts +++ b/packages/language-core/lib/codegen/template/elementDirectives.ts @@ -24,7 +24,6 @@ export function* generateElementDirectives( || prop.name === 'bind' || prop.name === 'scope' || prop.name === 'data' - || prop.name === 'generic' ) { continue; } From 02b354a32f19066a502b1ff415c135ca8a47c8b5 Mon Sep 17 00:00:00 2001 From: KazariEX <1364035137@qq.com> Date: Mon, 4 Nov 2024 01:37:50 +0800 Subject: [PATCH 012/345] refactor: remove unnecessary `import()`, `satisfies` and `typeof` --- packages/language-core/lib/codegen/template/element.ts | 2 +- .../language-core/lib/codegen/template/interpolation.ts | 2 +- packages/language-core/lib/plugins/vue-script-js.ts | 3 ++- packages/language-core/lib/types.ts | 4 ++-- packages/typescript-plugin/lib/requests/types.ts | 2 +- packages/typescript-plugin/lib/utils.ts | 6 +++--- 6 files changed, 10 insertions(+), 9 deletions(-) diff --git a/packages/language-core/lib/codegen/template/element.ts b/packages/language-core/lib/codegen/template/element.ts index 9e77166580..bcc253aa5d 100644 --- a/packages/language-core/lib/codegen/template/element.ts +++ b/packages/language-core/lib/codegen/template/element.ts @@ -661,7 +661,7 @@ function* generateReferencesForScopedCssClasses( const startOffset = prop.exp.loc.start.offset - 3; const { ts } = options; - const ast = ts.createSourceFile('', content, 99 satisfies typeof ts.ScriptTarget.Latest); + const ast = ts.createSourceFile('', content, 99 satisfies ts.ScriptTarget.Latest); const literals: ts.StringLiteralLike[] = []; ts.forEachChild(ast, node => { diff --git a/packages/language-core/lib/codegen/template/interpolation.ts b/packages/language-core/lib/codegen/template/interpolation.ts index 64fb39d916..f66fb18eea 100644 --- a/packages/language-core/lib/codegen/template/interpolation.ts +++ b/packages/language-core/lib/codegen/template/interpolation.ts @@ -7,7 +7,7 @@ import type { TemplateCodegenContext } from './context'; export function* generateInterpolation( options: { - ts: typeof import('typescript'), + ts: typeof ts, destructuredPropNames: Set | undefined, templateRefNames: Set | undefined }, diff --git a/packages/language-core/lib/plugins/vue-script-js.ts b/packages/language-core/lib/plugins/vue-script-js.ts index 225ebaf5ab..bf6dba031f 100644 --- a/packages/language-core/lib/plugins/vue-script-js.ts +++ b/packages/language-core/lib/plugins/vue-script-js.ts @@ -1,3 +1,4 @@ +import type * as ts from 'typescript'; import type { VueLanguagePlugin } from '../types'; const plugin: VueLanguagePlugin = ({ modules }) => { @@ -9,7 +10,7 @@ const plugin: VueLanguagePlugin = ({ modules }) => { compileSFCScript(lang, script) { if (lang === 'js' || lang === 'ts' || lang === 'jsx' || lang === 'tsx') { const ts = modules.typescript; - return ts.createSourceFile('test.' + lang, script, 99 satisfies typeof ts.ScriptTarget.Latest); + return ts.createSourceFile('test.' + lang, script, 99 satisfies ts.ScriptTarget.Latest); } }, }; diff --git a/packages/language-core/lib/types.ts b/packages/language-core/lib/types.ts index 2a6c93ba9b..feb015576c 100644 --- a/packages/language-core/lib/types.ts +++ b/packages/language-core/lib/types.ts @@ -83,8 +83,8 @@ export type VueLanguagePluginReturn = { export type VueLanguagePlugin = (ctx: { modules: { - typescript: typeof import('typescript'); - '@vue/compiler-dom': typeof import('@vue/compiler-dom'); + typescript: typeof ts; + '@vue/compiler-dom': typeof CompilerDOM; }; compilerOptions: ts.CompilerOptions; vueCompilerOptions: VueCompilerOptions; diff --git a/packages/typescript-plugin/lib/requests/types.ts b/packages/typescript-plugin/lib/requests/types.ts index 5fb5eced4f..731d1ec52b 100644 --- a/packages/typescript-plugin/lib/requests/types.ts +++ b/packages/typescript-plugin/lib/requests/types.ts @@ -2,7 +2,7 @@ import type { Language } from '@vue/language-core'; import type * as ts from 'typescript'; export interface RequestContext { - typescript: typeof import('typescript'); + typescript: typeof ts; languageService: ts.LanguageService; languageServiceHost: ts.LanguageServiceHost; language: Language; diff --git a/packages/typescript-plugin/lib/utils.ts b/packages/typescript-plugin/lib/utils.ts index 1c4a0a5a2b..2b153dfa4e 100644 --- a/packages/typescript-plugin/lib/utils.ts +++ b/packages/typescript-plugin/lib/utils.ts @@ -138,14 +138,14 @@ export async function searchNamedPipeServerForFile(fileName: string) { } // Find servers containing the current file - const containsFile = await sendRequestWorker({ type: 'containsFile' satisfies Request['type'], args: [fileName] }, socket); + const containsFile = await sendRequestWorker({ type: 'containsFile', args: [fileName] }, socket); if (!containsFile) { socket.end(); return; } // Get project info for each server - const projectInfo = await sendRequestWorker({ type: 'projectInfo' satisfies Request['type'], args: [fileName] }, socket); + const projectInfo = await sendRequestWorker({ type: 'projectInfo', args: [fileName] }, socket); if (!projectInfo) { socket.end(); return; @@ -179,7 +179,7 @@ export async function searchNamedPipeServerForFile(fileName: string) { } // Get project info for each server - const projectInfo = await sendRequestWorker({ type: 'projectInfo' satisfies Request['type'], args: [fileName] }, socket); + const projectInfo = await sendRequestWorker({ type: 'projectInfo', args: [fileName] }, socket); if (!projectInfo) { socket.end(); return; From cfd34e79daa08a7d5729dfa5510b788620ba1fa8 Mon Sep 17 00:00:00 2001 From: KazariEX <1364035137@qq.com> Date: Mon, 4 Nov 2024 01:38:27 +0800 Subject: [PATCH 013/345] refactor: use `node:` protocol imports consistently --- extensions/vscode/src/nodeClientMain.ts | 2 +- extensions/vscode/tests/grammar.spec.ts | 4 ++-- packages/component-meta/tests/index.spec.ts | 2 +- packages/language-server/tests/server.ts | 2 +- packages/tsc/tests/dts.spec.ts | 4 ++-- packages/tsc/tests/typecheck.spec.ts | 2 +- packages/typescript-plugin/lib/server.ts | 4 ++-- packages/typescript-plugin/lib/utils.ts | 8 ++++---- 8 files changed, 14 insertions(+), 14 deletions(-) diff --git a/extensions/vscode/src/nodeClientMain.ts b/extensions/vscode/src/nodeClientMain.ts index ad5de4612f..cf8359722c 100644 --- a/extensions/vscode/src/nodeClientMain.ts +++ b/extensions/vscode/src/nodeClientMain.ts @@ -1,7 +1,7 @@ import { createLabsInfo } from '@volar/vscode'; import * as lsp from '@volar/vscode/node'; import * as protocol from '@vue/language-server/protocol'; -import * as fs from 'fs'; +import * as fs from 'node:fs'; import { defineExtension, executeCommand, extensionContext, onDeactivate } from 'reactive-vscode'; import * as vscode from 'vscode'; import { config } from './config'; diff --git a/extensions/vscode/tests/grammar.spec.ts b/extensions/vscode/tests/grammar.spec.ts index 5171dc8244..e88e4a2659 100644 --- a/extensions/vscode/tests/grammar.spec.ts +++ b/extensions/vscode/tests/grammar.spec.ts @@ -1,5 +1,5 @@ -import * as fs from 'fs'; -import * as path from 'path'; +import * as fs from 'node:fs'; +import * as path from 'node:path'; import { describe, expect, it } from 'vitest'; import { createGrammarSnapshot } from 'vscode-tmlanguage-snapshot'; diff --git a/packages/component-meta/tests/index.spec.ts b/packages/component-meta/tests/index.spec.ts index 30436ed23e..1ca3323775 100644 --- a/packages/component-meta/tests/index.spec.ts +++ b/packages/component-meta/tests/index.spec.ts @@ -1,4 +1,4 @@ -import * as path from 'path'; +import * as path from 'node:path'; import { describe, expect, test } from 'vitest'; import { ComponentMetaChecker, createChecker, createCheckerByJson, MetaCheckerOptions, TypeMeta } from '..'; diff --git a/packages/language-server/tests/server.ts b/packages/language-server/tests/server.ts index 510f46b921..fbce2d8992 100644 --- a/packages/language-server/tests/server.ts +++ b/packages/language-server/tests/server.ts @@ -1,7 +1,7 @@ import { ConfigurationRequest, PublishDiagnosticsNotification } from '@volar/language-server'; import type { LanguageServerHandle } from '@volar/test-utils'; import { startLanguageServer } from '@volar/test-utils'; -import * as path from 'path'; +import * as path from 'node:path'; import { URI } from 'vscode-uri'; let serverHandle: LanguageServerHandle | undefined; diff --git a/packages/tsc/tests/dts.spec.ts b/packages/tsc/tests/dts.spec.ts index 85dae0440c..3049555263 100644 --- a/packages/tsc/tests/dts.spec.ts +++ b/packages/tsc/tests/dts.spec.ts @@ -1,7 +1,7 @@ import { proxyCreateProgram } from '@volar/typescript'; import * as vue from '@vue/language-core'; -import * as fs from 'fs'; -import * as path from 'path'; +import * as fs from 'node:fs'; +import * as path from 'node:path'; import * as ts from 'typescript'; import { describe, expect, it } from 'vitest'; diff --git a/packages/tsc/tests/typecheck.spec.ts b/packages/tsc/tests/typecheck.spec.ts index 9b981d2088..ac97fb2c35 100644 --- a/packages/tsc/tests/typecheck.spec.ts +++ b/packages/tsc/tests/typecheck.spec.ts @@ -1,4 +1,4 @@ -import * as path from 'path'; +import * as path from 'node:path'; import { describe, expect, test } from 'vitest'; import { run } from '..'; diff --git a/packages/typescript-plugin/lib/server.ts b/packages/typescript-plugin/lib/server.ts index 30ae6d5629..4f7a3b93fc 100644 --- a/packages/typescript-plugin/lib/server.ts +++ b/packages/typescript-plugin/lib/server.ts @@ -1,6 +1,6 @@ import type { Language } from '@vue/language-core'; -import * as fs from 'fs'; -import * as net from 'net'; +import * as fs from 'node:fs'; +import * as net from 'node:net'; import type * as ts from 'typescript'; import { collectExtractProps } from './requests/collectExtractProps'; import { getComponentEvents, getComponentNames, getComponentProps, getElementAttrs, getTemplateContextProps } from './requests/componentInfos'; diff --git a/packages/typescript-plugin/lib/utils.ts b/packages/typescript-plugin/lib/utils.ts index 2b153dfa4e..22a8f0bb83 100644 --- a/packages/typescript-plugin/lib/utils.ts +++ b/packages/typescript-plugin/lib/utils.ts @@ -1,7 +1,7 @@ -import * as fs from 'fs'; -import * as net from 'net'; -import * as os from 'os'; -import * as path from 'path'; +import * as fs from 'node:fs'; +import * as net from 'node:net'; +import * as os from 'node:os'; +import * as path from 'node:path'; import type * as ts from 'typescript'; import type { ProjectInfo, Request } from './server'; From 874300cb27d15363883f382e49ff72a5a899bb23 Mon Sep 17 00:00:00 2001 From: KazariEX <1364035137@qq.com> Date: Mon, 4 Nov 2024 01:39:53 +0800 Subject: [PATCH 014/345] refactor: remove unnecessary type annotation --- extensions/vscode/src/features/doctor.ts | 6 +++--- extensions/vscode/src/languageClient.ts | 2 +- packages/component-meta/lib/base.ts | 4 ++-- .../language-core/lib/codegen/template/elementEvents.ts | 2 +- packages/language-core/lib/parsers/scriptSetupRanges.ts | 8 ++------ packages/language-core/lib/plugins/file-vue.ts | 2 +- packages/language-core/lib/plugins/vue-tsx.ts | 3 +-- packages/language-core/lib/utils/ts.ts | 4 ++-- packages/language-core/lib/utils/vue2TemplateCompiler.ts | 2 +- packages/language-plugin-pug/index.ts | 2 +- packages/language-server/lib/hybridModeProject.ts | 2 +- packages/language-service/index.ts | 4 ++-- packages/language-service/lib/plugins/css.ts | 4 ++-- .../lib/plugins/vue-autoinsert-dotvalue.ts | 4 ++-- .../language-service/lib/plugins/vue-autoinsert-space.ts | 4 ++-- .../lib/plugins/vue-complete-define-assignment.ts | 4 ++-- .../lib/plugins/vue-directive-comments.ts | 4 ++-- .../language-service/lib/plugins/vue-document-drop.ts | 4 ++-- .../language-service/lib/plugins/vue-document-links.ts | 4 ++-- packages/language-service/lib/plugins/vue-inlayhints.ts | 3 +-- packages/language-service/lib/plugins/vue-sfc.ts | 4 ++-- packages/language-service/lib/plugins/vue-template.ts | 4 ++-- .../language-service/lib/plugins/vue-twoslash-queries.ts | 4 ++-- packages/tsc/tests/dts.spec.ts | 2 +- 24 files changed, 40 insertions(+), 46 deletions(-) diff --git a/extensions/vscode/src/features/doctor.ts b/extensions/vscode/src/features/doctor.ts index 4de7b7c646..8db6272f9a 100644 --- a/extensions/vscode/src/features/doctor.ts +++ b/extensions/vscode/src/features/doctor.ts @@ -40,7 +40,7 @@ export async function activate(client: BaseLanguageClient) { scheme, { onDidChange: docChangeEvent.event, - async provideTextDocumentContent(doctorUri: vscode.Uri): Promise { + async provideTextDocumentContent(doctorUri: vscode.Uri) { const fileUri = doctorUri.with({ scheme: 'file', @@ -260,12 +260,12 @@ export async function activate(client: BaseLanguageClient) { } } -function getPackageJsonOfWorkspacePackage(folder: string, pkg: string): { path: string, json: { version: string; }; } | undefined { +function getPackageJsonOfWorkspacePackage(folder: string, pkg: string) { try { const path = require.resolve(pkg + '/package.json', { paths: [folder] }); return { path, - json: require(path), + json: require(path) as { version: string }, }; } catch { } } diff --git a/extensions/vscode/src/languageClient.ts b/extensions/vscode/src/languageClient.ts index 4d594ff617..e7948f40d9 100644 --- a/extensions/vscode/src/languageClient.ts +++ b/extensions/vscode/src/languageClient.ts @@ -50,7 +50,7 @@ export function activate( }); } -export function deactivate(): Thenable | undefined { +export function deactivate() { return client?.stop(); } diff --git a/packages/component-meta/lib/base.ts b/packages/component-meta/lib/base.ts index a749811c81..6bde6ab32d 100644 --- a/packages/component-meta/lib/base.ts +++ b/packages/component-meta/lib/base.ts @@ -666,11 +666,11 @@ function createSchemaResolvers( return type; } - function getDeclarations(declaration: ts.Declaration[]): Declaration[] { + function getDeclarations(declaration: ts.Declaration[]) { if (noDeclarations) { return []; } - return declaration.map(getDeclaration).filter(d => !!d) as Declaration[]; + return declaration.map(getDeclaration).filter(d => !!d); } function getDeclaration(declaration: ts.Declaration): Declaration | undefined { const fileName = declaration.getSourceFile().fileName; diff --git a/packages/language-core/lib/codegen/template/elementEvents.ts b/packages/language-core/lib/codegen/template/elementEvents.ts index a8aa061084..498330f2a5 100644 --- a/packages/language-core/lib/codegen/template/elementEvents.ts +++ b/packages/language-core/lib/codegen/template/elementEvents.ts @@ -211,7 +211,7 @@ export function isCompoundExpression(ts: typeof import('typescript'), ast: ts.So return result; } -function isPropertyAccessOrId(ts: typeof import('typescript'), node: ts.Node): boolean { +function isPropertyAccessOrId(ts: typeof import('typescript'), node: ts.Node) { if (ts.isIdentifier(node)) { return true; } diff --git a/packages/language-core/lib/parsers/scriptSetupRanges.ts b/packages/language-core/lib/parsers/scriptSetupRanges.ts index 6e4f82e5c5..b4906c45cd 100644 --- a/packages/language-core/lib/parsers/scriptSetupRanges.ts +++ b/packages/language-core/lib/parsers/scriptSetupRanges.ts @@ -136,11 +136,7 @@ export function parseScriptSetupRanges( return getStartEnd(ts, node, ast); } - function parseDefineFunction(node: ts.CallExpression): TextRange & { - exp: TextRange; - arg?: TextRange; - typeArg?: TextRange; - } { + function parseDefineFunction(node: ts.CallExpression) { return { ..._getStartEnd(node), exp: _getStartEnd(node.expression), @@ -499,7 +495,7 @@ export function getStartEnd( ts: typeof import('typescript'), node: ts.Node, sourceFile: ts.SourceFile -) { +): TextRange { return { start: (ts as any).getTokenPosOfNode(node, sourceFile) as number, end: node.end, diff --git a/packages/language-core/lib/plugins/file-vue.ts b/packages/language-core/lib/plugins/file-vue.ts index 441c4022a1..d323a3fd10 100644 --- a/packages/language-core/lib/plugins/file-vue.ts +++ b/packages/language-core/lib/plugins/file-vue.ts @@ -32,7 +32,7 @@ const plugin: VueLanguagePlugin = ({ vueCompilerOptions }) => { sfc.descriptor.scriptSetup, ...sfc.descriptor.styles, ...sfc.descriptor.customBlocks, - ].filter((block): block is NonNullable => !!block); + ].filter(block => !!block); const hitBlock = blocks.find(block => change.start >= block.loc.start.offset && change.end <= block.loc.end.offset); if (!hitBlock) { diff --git a/packages/language-core/lib/plugins/vue-tsx.ts b/packages/language-core/lib/plugins/vue-tsx.ts index 528df79ad1..43cad99a2b 100644 --- a/packages/language-core/lib/plugins/vue-tsx.ts +++ b/packages/language-core/lib/plugins/vue-tsx.ts @@ -42,8 +42,7 @@ const plugin: VueLanguagePlugin = ctx => { if (/script_(js|jsx|ts|tsx)/.test(embeddedFile.id)) { const tsx = _tsx.generatedScript.get(); if (tsx) { - const content: Code[] = [...tsx.codes]; - embeddedFile.content = content; + embeddedFile.content = [...tsx.codes]; embeddedFile.linkedCodeMappings = [...tsx.linkedCodeMappings]; } } diff --git a/packages/language-core/lib/utils/ts.ts b/packages/language-core/lib/utils/ts.ts index ec2430f613..4b8ebda122 100644 --- a/packages/language-core/lib/utils/ts.ts +++ b/packages/language-core/lib/utils/ts.ts @@ -156,7 +156,7 @@ function proxyParseConfigHostForExtendConfigPaths(parseConfigHost: ts.ParseConfi function getPartialVueCompilerOptions( ts: typeof import('typescript'), tsConfigSourceFile: ts.TsConfigSourceFile -): Partial { +) { const folder = path.dirname(tsConfigSourceFile.fileName); const obj = ts.convertToObject(tsConfigSourceFile, []); @@ -205,7 +205,7 @@ function getPartialVueCompilerOptions( return result; - function resolvePath(scriptPath: string): string | undefined { + function resolvePath(scriptPath: string) { try { if (require?.resolve) { return require.resolve(scriptPath, { paths: [folder] }); diff --git a/packages/language-core/lib/utils/vue2TemplateCompiler.ts b/packages/language-core/lib/utils/vue2TemplateCompiler.ts index d0c131872e..de91efce02 100644 --- a/packages/language-core/lib/utils/vue2TemplateCompiler.ts +++ b/packages/language-core/lib/utils/vue2TemplateCompiler.ts @@ -72,7 +72,7 @@ export const compile: typeof CompilerDOM.compile = (template, options = {}) => { function baseCompile( template: string, options: CompilerDOM.CompilerOptions = {} -): CompilerDOM.CodegenResult { +) { const onError = options.onError || (error => { throw error; }); const isModuleMode = options.mode === 'module'; diff --git a/packages/language-plugin-pug/index.ts b/packages/language-plugin-pug/index.ts index 97e37f6415..e445237429 100644 --- a/packages/language-plugin-pug/index.ts +++ b/packages/language-plugin-pug/index.ts @@ -77,7 +77,7 @@ const plugin: VueLanguagePlugin = ({ modules }) => { return createProxyObject(completed); - function createProxyObject(target: any): any { + function createProxyObject(target: any) { const proxys = new WeakMap(); return new Proxy(target, { get(target, prop, receiver) { diff --git a/packages/language-server/lib/hybridModeProject.ts b/packages/language-server/lib/hybridModeProject.ts index c1d629647e..5a606bd530 100644 --- a/packages/language-server/lib/hybridModeProject.ts +++ b/packages/language-server/lib/hybridModeProject.ts @@ -16,7 +16,7 @@ export function createHybridModeProject( project: ProjectContext; }): void; }> -): LanguageServerProject { +) { let simpleLs: Promise | undefined; let server: LanguageServer; diff --git a/packages/language-service/index.ts b/packages/language-service/index.ts index 6710688c2b..237444e3d5 100644 --- a/packages/language-service/index.ts +++ b/packages/language-service/index.ts @@ -49,7 +49,7 @@ declare module '@volar/language-service' { export function getFullLanguageServicePlugins( ts: typeof import('typescript'), { disableAutoImportCache }: { disableAutoImportCache?: boolean; } = {} -): LanguageServicePlugin[] { +) { const plugins: LanguageServicePlugin[] = [ ...createTypeScriptPlugins(ts, { disableAutoImportCache }), ...getCommonLanguageServicePlugins( @@ -170,7 +170,7 @@ export function getFullLanguageServicePlugins( export function getHybridModeLanguageServicePlugins( ts: typeof import('typescript'), getTsPluginClient: typeof import("@vue/typescript-plugin/lib/client") -): LanguageServicePlugin[] { +) { const plugins = [ createTypeScriptSyntacticPlugin(ts), createTypeScriptDocCommentTemplatePlugin(ts), diff --git a/packages/language-service/lib/plugins/css.ts b/packages/language-service/lib/plugins/css.ts index 9c6128dc2a..de1dcaa276 100644 --- a/packages/language-service/lib/plugins/css.ts +++ b/packages/language-service/lib/plugins/css.ts @@ -1,11 +1,11 @@ -import type { LanguageServicePlugin, LanguageServicePluginInstance } from '@volar/language-service'; +import type { LanguageServicePlugin } from '@volar/language-service'; import { create as baseCreate } from 'volar-service-css'; export function create(): LanguageServicePlugin { const base = baseCreate({ scssDocumentSelector: ['scss', 'postcss'] }); return { ...base, - create(context): LanguageServicePluginInstance { + create(context) { const baseInstance = base.create(context); return { ...baseInstance, diff --git a/packages/language-service/lib/plugins/vue-autoinsert-dotvalue.ts b/packages/language-service/lib/plugins/vue-autoinsert-dotvalue.ts index 3c07c84f23..a002ee37f9 100644 --- a/packages/language-service/lib/plugins/vue-autoinsert-dotvalue.ts +++ b/packages/language-service/lib/plugins/vue-autoinsert-dotvalue.ts @@ -1,4 +1,4 @@ -import type { LanguageServiceContext, LanguageServicePlugin, LanguageServicePluginInstance } from '@volar/language-service'; +import type { LanguageServiceContext, LanguageServicePlugin } from '@volar/language-service'; import { hyphenateAttr } from '@vue/language-core'; import type * as ts from 'typescript'; import type { TextDocument } from 'vscode-languageserver-textdocument'; @@ -27,7 +27,7 @@ export function create( configurationSections: ['vue.autoInsert.dotValue'], }, }, - create(context): LanguageServicePluginInstance { + create(context) { const tsPluginClient = getTsPluginClient?.(context); let currentReq = 0; return { diff --git a/packages/language-service/lib/plugins/vue-autoinsert-space.ts b/packages/language-service/lib/plugins/vue-autoinsert-space.ts index 4ff7c0de91..30ab8243c0 100644 --- a/packages/language-service/lib/plugins/vue-autoinsert-space.ts +++ b/packages/language-service/lib/plugins/vue-autoinsert-space.ts @@ -1,4 +1,4 @@ -import type { LanguageServicePlugin, LanguageServicePluginInstance } from '@volar/language-service'; +import type { LanguageServicePlugin } from '@volar/language-service'; export function create(): LanguageServicePlugin { return { @@ -9,7 +9,7 @@ export function create(): LanguageServicePlugin { configurationSections: ['vue.autoInsert.bracketSpacing'], }, }, - create(context): LanguageServicePluginInstance { + create(context) { return { async provideAutoInsertSnippet(document, selection, change) { diff --git a/packages/language-service/lib/plugins/vue-complete-define-assignment.ts b/packages/language-service/lib/plugins/vue-complete-define-assignment.ts index 20853a0bc2..320d8e288e 100644 --- a/packages/language-service/lib/plugins/vue-complete-define-assignment.ts +++ b/packages/language-service/lib/plugins/vue-complete-define-assignment.ts @@ -1,4 +1,4 @@ -import type { LanguageServicePlugin, LanguageServicePluginInstance } from '@volar/language-service'; +import type { LanguageServicePlugin } from '@volar/language-service'; import { TextRange, tsCodegen, VueVirtualCode } from '@vue/language-core'; import type * as vscode from 'vscode-languageserver-protocol'; import { URI } from 'vscode-uri'; @@ -10,7 +10,7 @@ export function create(): LanguageServicePlugin { capabilities: { completionProvider: {}, }, - create(context): LanguageServicePluginInstance { + create(context) { return { isAdditionalCompletion: true, async provideCompletionItems(document) { diff --git a/packages/language-service/lib/plugins/vue-directive-comments.ts b/packages/language-service/lib/plugins/vue-directive-comments.ts index c695d02644..ee144e4f48 100644 --- a/packages/language-service/lib/plugins/vue-directive-comments.ts +++ b/packages/language-service/lib/plugins/vue-directive-comments.ts @@ -1,4 +1,4 @@ -import type { CompletionItem, LanguageServicePlugin, LanguageServicePluginInstance } from '@volar/language-service'; +import type { CompletionItem, LanguageServicePlugin } from '@volar/language-service'; import type * as vscode from 'vscode-languageserver-protocol'; const cmds = [ @@ -18,7 +18,7 @@ export function create(): LanguageServicePlugin { triggerCharacters: ['@'], }, }, - create(): LanguageServicePluginInstance { + create() { return { provideCompletionItems(document, position) { diff --git a/packages/language-service/lib/plugins/vue-document-drop.ts b/packages/language-service/lib/plugins/vue-document-drop.ts index a6aa6b220b..44ad8b6cee 100644 --- a/packages/language-service/lib/plugins/vue-document-drop.ts +++ b/packages/language-service/lib/plugins/vue-document-drop.ts @@ -5,7 +5,7 @@ import { getUserPreferences } from 'volar-service-typescript/lib/configs/getUser import type * as vscode from 'vscode-languageserver-protocol'; import { URI } from 'vscode-uri'; import { createAddComponentToOptionEdit, getLastImportNode } from '../plugins/vue-extract-file'; -import { LanguageServiceContext, LanguageServicePlugin, LanguageServicePluginInstance, TagNameCasing } from '../types'; +import { LanguageServiceContext, LanguageServicePlugin, TagNameCasing } from '../types'; export function create( ts: typeof import('typescript'), @@ -16,7 +16,7 @@ export function create( capabilities: { documentDropEditsProvider: true, }, - create(context): LanguageServicePluginInstance { + create(context) { if (!context.project.vue) { return {}; } diff --git a/packages/language-service/lib/plugins/vue-document-links.ts b/packages/language-service/lib/plugins/vue-document-links.ts index 23947e09ac..dbb423e111 100644 --- a/packages/language-service/lib/plugins/vue-document-links.ts +++ b/packages/language-service/lib/plugins/vue-document-links.ts @@ -1,4 +1,4 @@ -import type { LanguageServicePlugin, LanguageServicePluginInstance } from '@volar/language-service'; +import type { LanguageServicePlugin } from '@volar/language-service'; import { Sfc, VueVirtualCode, tsCodegen } from '@vue/language-core'; import type * as vscode from 'vscode-languageserver-protocol'; import { URI } from 'vscode-uri'; @@ -9,7 +9,7 @@ export function create(): LanguageServicePlugin { capabilities: { documentLinkProvider: {}, }, - create(context): LanguageServicePluginInstance { + create(context) { return { provideDocumentLinks(document) { diff --git a/packages/language-service/lib/plugins/vue-inlayhints.ts b/packages/language-service/lib/plugins/vue-inlayhints.ts index c9e0536e9a..18318c3b85 100644 --- a/packages/language-service/lib/plugins/vue-inlayhints.ts +++ b/packages/language-service/lib/plugins/vue-inlayhints.ts @@ -1,4 +1,3 @@ -import type { LanguageServicePluginInstance } from '@volar/language-service'; import { tsCodegen, VueVirtualCode } from '@vue/language-core'; import { collectIdentifiers } from '@vue/language-core/lib/codegen/utils/index'; import type * as ts from 'typescript'; @@ -12,7 +11,7 @@ export function create(ts: typeof import('typescript')): LanguageServicePlugin { capabilities: { inlayHintProvider: {}, }, - create(context): LanguageServicePluginInstance { + create(context) { return { async provideInlayHints(document, range) { diff --git a/packages/language-service/lib/plugins/vue-sfc.ts b/packages/language-service/lib/plugins/vue-sfc.ts index d8733792d3..849f59bf55 100644 --- a/packages/language-service/lib/plugins/vue-sfc.ts +++ b/packages/language-service/lib/plugins/vue-sfc.ts @@ -1,4 +1,4 @@ -import type { LanguageServiceContext, LanguageServicePlugin, LanguageServicePluginInstance } from '@volar/language-service'; +import type { LanguageServiceContext, LanguageServicePlugin } from '@volar/language-service'; import * as vue from '@vue/language-core'; import { create as createHtmlService } from 'volar-service-html'; import * as html from 'vscode-html-languageservice'; @@ -43,7 +43,7 @@ export function create(): LanguageServicePlugin { return { ...htmlPlugin, name: 'vue-sfc', - create(context): LanguageServicePluginInstance { + create(context) { const htmlPluginInstance = htmlPlugin.create(context); return { diff --git a/packages/language-service/lib/plugins/vue-template.ts b/packages/language-service/lib/plugins/vue-template.ts index 3bc7be5a94..afef4331ad 100644 --- a/packages/language-service/lib/plugins/vue-template.ts +++ b/packages/language-service/lib/plugins/vue-template.ts @@ -86,7 +86,7 @@ export function create( }, } }, - create(context): LanguageServicePluginInstance { + create(context) { const tsPluginClient = getTsPluginClient?.(context); const baseServiceInstance = baseService.create(context); @@ -1032,7 +1032,7 @@ function getReplacement(list: html.CompletionList, doc: TextDocument) { function getPropName( itemKey: ReturnType & {} -): { isEvent: boolean, propName: string; } { +) { const name = hyphenateAttr(itemKey.prop); if (name.startsWith('on-')) { return { isEvent: true, propName: name.slice('on-'.length) }; diff --git a/packages/language-service/lib/plugins/vue-twoslash-queries.ts b/packages/language-service/lib/plugins/vue-twoslash-queries.ts index c293bd2bd4..e35b89c243 100644 --- a/packages/language-service/lib/plugins/vue-twoslash-queries.ts +++ b/packages/language-service/lib/plugins/vue-twoslash-queries.ts @@ -1,4 +1,4 @@ -import type { LanguageServiceContext, LanguageServicePlugin, LanguageServicePluginInstance } from '@volar/language-service'; +import type { LanguageServiceContext, LanguageServicePlugin } from '@volar/language-service'; import * as vue from '@vue/language-core'; import type * as vscode from 'vscode-languageserver-protocol'; import { URI } from 'vscode-uri'; @@ -13,7 +13,7 @@ export function create( capabilities: { inlayHintProvider: {}, }, - create(context): LanguageServicePluginInstance { + create(context) { const tsPluginClient = getTsPluginClient?.(context); return { async provideInlayHints(document, range) { diff --git a/packages/tsc/tests/dts.spec.ts b/packages/tsc/tests/dts.spec.ts index 3049555263..50e65e887a 100644 --- a/packages/tsc/tests/dts.spec.ts +++ b/packages/tsc/tests/dts.spec.ts @@ -88,7 +88,7 @@ function readFilesRecursive(dir: string) { return result; } -function shortenPath(path: string): string { +function shortenPath(path: string) { path = normalizePath(path); const segments = path.split('/'); return segments.slice(-2).join('/'); From 00f6df58d7753b6d6b4dc928ac8e7e99ec5eee2e Mon Sep 17 00:00:00 2001 From: Sacha Stafyniak Date: Mon, 4 Nov 2024 09:14:29 +0100 Subject: [PATCH 015/345] fix(language-core): make model modifiers optional (#4978) Co-authored-by: KazariEX <1364035137@qq.com> --- packages/language-core/lib/codegen/script/scriptSetup.ts | 2 +- packages/tsc/tests/__snapshots__/dts.spec.ts.snap | 2 +- test-workspace/tsc/passedFixtures/vue3/#4978/comp.vue | 3 +++ test-workspace/tsc/passedFixtures/vue3/#4978/main.vue | 7 +++++++ 4 files changed, 12 insertions(+), 2 deletions(-) create mode 100644 test-workspace/tsc/passedFixtures/vue3/#4978/comp.vue create mode 100644 test-workspace/tsc/passedFixtures/vue3/#4978/main.vue diff --git a/packages/language-core/lib/codegen/script/scriptSetup.ts b/packages/language-core/lib/codegen/script/scriptSetup.ts index e8e319e39e..bc3117e60d 100644 --- a/packages/language-core/lib/codegen/script/scriptSetup.ts +++ b/packages/language-core/lib/codegen/script/scriptSetup.ts @@ -441,7 +441,7 @@ function* generateComponentProps( } const modifierType = getRangeName(scriptSetup, defineProp.modifierType); definePropMirrors.set(propModifierName, options.getGeneratedLength()); - yield `${propModifierName}?: Record<${modifierType}, true>,${endOfLine}`; + yield `${propModifierName}?: Partial>,${endOfLine}`; } } yield `}`; diff --git a/packages/tsc/tests/__snapshots__/dts.spec.ts.snap b/packages/tsc/tests/__snapshots__/dts.spec.ts.snap index 91cc664194..ba17f1516c 100644 --- a/packages/tsc/tests/__snapshots__/dts.spec.ts.snap +++ b/packages/tsc/tests/__snapshots__/dts.spec.ts.snap @@ -318,7 +318,7 @@ exports[`vue-tsc-dts > Input: reference-type-model/component.vue, Output: refere "foo"?: number; "bar"?: string[]; "qux"?: string; - quxModifiers?: Record<'lazy' | 'trim', true>; + quxModifiers?: Partial>; }; declare const _default: import("vue").DefineComponent>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, { "update:foo": (value: number) => void; diff --git a/test-workspace/tsc/passedFixtures/vue3/#4978/comp.vue b/test-workspace/tsc/passedFixtures/vue3/#4978/comp.vue new file mode 100644 index 0000000000..e9c350ee14 --- /dev/null +++ b/test-workspace/tsc/passedFixtures/vue3/#4978/comp.vue @@ -0,0 +1,3 @@ + diff --git a/test-workspace/tsc/passedFixtures/vue3/#4978/main.vue b/test-workspace/tsc/passedFixtures/vue3/#4978/main.vue new file mode 100644 index 0000000000..cedfe1eda3 --- /dev/null +++ b/test-workspace/tsc/passedFixtures/vue3/#4978/main.vue @@ -0,0 +1,7 @@ + + + From 4d7d8bf7a0e984ef70262b1a52950cf2e6e64a60 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=B1=B1=E5=90=B9=E8=89=B2=E5=BE=A1=E5=AE=88?= <85992002+KazariEX@users.noreply.github.com> Date: Mon, 4 Nov 2024 18:39:48 +0800 Subject: [PATCH 016/345] fix(language-core): always report missing props on `` (#4982) Co-authored-by: Johnson Chu --- packages/language-core/lib/codegen/template/element.ts | 8 ++++---- .../language-core/lib/codegen/template/elementProps.ts | 9 +++++---- .../language-core/lib/codegen/template/slotOutlet.ts | 4 ++-- test-workspace/tsc/passedFixtures/vue3/#4979/main.vue | 10 ++++++++++ 4 files changed, 21 insertions(+), 10 deletions(-) create mode 100644 test-workspace/tsc/passedFixtures/vue3/#4979/main.vue diff --git a/packages/language-core/lib/codegen/template/element.ts b/packages/language-core/lib/codegen/template/element.ts index bcc253aa5d..ec9c86def8 100644 --- a/packages/language-core/lib/codegen/template/element.ts +++ b/packages/language-core/lib/codegen/template/element.ts @@ -85,7 +85,7 @@ export function* generateComponent( yield `// @ts-ignore${newLine}`; // #2304 yield `/** @type { [`; for (const tagOffset of tagOffsets) { - yield `typeof ` + yield `typeof `; if (var_originalComponent === node.tag) { yield [ var_originalComponent, @@ -201,7 +201,7 @@ export function* generateComponent( yield `// @ts-ignore${newLine}`; yield `const ${var_functionalComponent} = __VLS_asFunctionalComponent(${var_originalComponent}, new ${var_originalComponent}({`; - yield* generateElementProps(options, ctx, node, props, false); + yield* generateElementProps(options, ctx, node, props, options.vueCompilerOptions.strictTemplates, false); yield `}))${endOfLine}`; yield `const ${var_componentInstance} = ${var_functionalComponent}`; @@ -212,7 +212,7 @@ export function* generateComponent( startTagOffset + node.tag.length, ctx.codeFeatures.verification, `{`, - ...generateElementProps(options, ctx, node, props, true, failedPropExps), + ...generateElementProps(options, ctx, node, props, options.vueCompilerOptions.strictTemplates, true, failedPropExps), `}` ); yield `, ...__VLS_functionalComponentArgsRest(${var_functionalComponent}))${endOfLine}`; @@ -315,7 +315,7 @@ export function* generateElement( startTagOffset + node.tag.length, ctx.codeFeatures.verification, `{`, - ...generateElementProps(options, ctx, node, node.props, true, failedPropExps), + ...generateElementProps(options, ctx, node, node.props, options.vueCompilerOptions.strictTemplates, true, failedPropExps), `}` ); yield `)${endOfLine}`; diff --git a/packages/language-core/lib/codegen/template/elementProps.ts b/packages/language-core/lib/codegen/template/elementProps.ts index 66ff31cc33..74512d60f8 100644 --- a/packages/language-core/lib/codegen/template/elementProps.ts +++ b/packages/language-core/lib/codegen/template/elementProps.ts @@ -25,6 +25,7 @@ export function* generateElementProps( ctx: TemplateCodegenContext, node: CompilerDOM.ElementNode, props: CompilerDOM.ElementNode['props'], + strictPropsCheck: boolean, enableCodeFeatures: boolean, failedPropExps?: FailedPropExpression[] ): Generator { @@ -112,7 +113,7 @@ export function* generateElementProps( if (shouldSpread) { yield `...{ `; } - const codeInfo = getPropsCodeInfo(options, ctx, shouldCamelize); + const codeInfo = getPropsCodeInfo(ctx, strictPropsCheck, shouldCamelize); const codes = wrapWith( prop.loc.start.offset, prop.loc.end.offset, @@ -179,7 +180,7 @@ export function* generateElementProps( if (shouldSpread) { yield `...{ `; } - const codeInfo = getPropsCodeInfo(options, ctx, true); + const codeInfo = getPropsCodeInfo(ctx, strictPropsCheck, true); const codes = conditionWrapWith( enableCodeFeatures, prop.loc.start.offset, @@ -249,8 +250,8 @@ export function* generateElementProps( } function getPropsCodeInfo( - options: TemplateCodegenOptions, ctx: TemplateCodegenContext, + strictPropsCheck: boolean, shouldCamelize: boolean ): VueCodeInformation { const codeInfo = ctx.codeFeatures.withoutHighlightAndCompletion; @@ -262,7 +263,7 @@ function getPropsCodeInfo( resolveRenameEditText: shouldCamelize ? hyphenateAttr : undefined, } : false, - verification: options.vueCompilerOptions.strictTemplates + verification: strictPropsCheck ? codeInfo.verification : { shouldReport(_source, code) { diff --git a/packages/language-core/lib/codegen/template/slotOutlet.ts b/packages/language-core/lib/codegen/template/slotOutlet.ts index 632ffc056e..ec9241911f 100644 --- a/packages/language-core/lib/codegen/template/slotOutlet.ts +++ b/packages/language-core/lib/codegen/template/slotOutlet.ts @@ -55,14 +55,14 @@ export function* generateSlotOutlet( startTagOffset + node.tag.length, ctx.codeFeatures.verification, `{${newLine}`, - ...generateElementProps(options, ctx, node, node.props.filter(prop => prop !== nameProp), true), + ...generateElementProps(options, ctx, node, node.props.filter(prop => prop !== nameProp), true, true), `}` ); yield `)${endOfLine}`; } else { yield `var ${varSlot} = {${newLine}`; - yield* generateElementProps(options, ctx, node, node.props.filter(prop => prop !== nameProp), true); + yield* generateElementProps(options, ctx, node, node.props.filter(prop => prop !== nameProp), options.vueCompilerOptions.strictTemplates, true); yield `}${endOfLine}`; if ( diff --git a/test-workspace/tsc/passedFixtures/vue3/#4979/main.vue b/test-workspace/tsc/passedFixtures/vue3/#4979/main.vue new file mode 100644 index 0000000000..5a07cebbaf --- /dev/null +++ b/test-workspace/tsc/passedFixtures/vue3/#4979/main.vue @@ -0,0 +1,10 @@ + + + From eb5a82cca6dfa24a1c91496f72e31dccc076f108 Mon Sep 17 00:00:00 2001 From: ZeroMask Date: Mon, 4 Nov 2024 15:32:35 +0300 Subject: [PATCH 017/345] docs: update nvim guide (#4984) --- README.md | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index 182573c9e7..d00e4bffc3 100644 --- a/README.md +++ b/README.md @@ -34,6 +34,8 @@ Note: The "Take Over" mode has been discontinued. Instead, a new "Hybrid" mode has been introduced. In this mode, the Vue Language Server exclusively manages the CSS/HTML sections. As a result, you must run `@vue/language-server` in conjunction with a TypeScript server that employs `@vue/typescript-plugin`. Below is a streamlined configuration for Neovim's LSP, updated to accommodate the language server following the upgrade to version `2.0.0`. +> For nvim-lspconfig versions below [v1.0.0](https://newreleases.io/project/github/neovim/nvim-lspconfig/release/v1.0.0) use tsserver instead of ts_ls, e.g. `lspconfig.ts_ls.setup` + ```lua -- If you are using mason.nvim, you can get the ts_plugin_path like this -- local mason_registry = require('mason-registry') @@ -43,7 +45,7 @@ local vue_language_server_path = '/path/to/@vue/language-server' local lspconfig = require('lspconfig') -lspconfig.tsserver.setup { +lspconfig.ts_ls.setup { init_options = { plugins = { { @@ -62,7 +64,7 @@ lspconfig.volar.setup {} ### Non-Hybrid mode(similar to takeover mode) configuration (Requires `@vue/language-server` version `^2.0.7`) -Note: If `hybridMode` is set to `false` `Volar` will run embedded `tsserver` therefore there is no need to run it separately. +Note: If `hybridMode` is set to `false` `Volar` will run embedded `ts_ls` therefore there is no need to run it separately. For more information see [#4119](https://github.com/vuejs/language-tools/pull/4119) @@ -72,7 +74,7 @@ Use volar for all `.{vue,js,ts,tsx,jsx}` files. ```lua local lspconfig = require('lspconfig') --- lspconfig.tsserver.setup {} +-- lspconfig.ts_ls.setup {} lspconfig.volar.setup { filetypes = { 'typescript', 'javascript', 'javascriptreact', 'typescriptreact', 'vue' }, init_options = { @@ -83,11 +85,11 @@ lspconfig.volar.setup { } ``` -Use `volar` for only `.vue` files and `tsserver` for `.ts` and `.js` files. +Use `volar` for only `.vue` files and `ts_ls` for `.ts` and `.js` files. ```lua local lspconfig = require('lspconfig') -lspconfig.tsserver.setup { +lspconfig.ts_ls.setup { init_options = { plugins = { { From baa843e8e0ea5b579fec16023d73eaaafb50ee62 Mon Sep 17 00:00:00 2001 From: Johnson Chu Date: Tue, 5 Nov 2024 19:15:36 +0800 Subject: [PATCH 018/345] lint: use `@johnsoncodehk/tsslint-config` (#4986) --- extensions/vscode/package.json | 2 +- .../lib/parsers/scriptSetupRanges.ts | 2 +- packages/typescript-plugin/index.ts | 2 +- packages/typescript-plugin/lib/server.ts | 2 +- packages/typescript-plugin/lib/utils.ts | 2 +- pnpm-lock.yaml | 586 +++++++++--------- tsslint.config.ts | 19 +- 7 files changed, 303 insertions(+), 312 deletions(-) diff --git a/extensions/vscode/package.json b/extensions/vscode/package.json index 5807857f33..95c5a62c75 100644 --- a/extensions/vscode/package.json +++ b/extensions/vscode/package.json @@ -562,7 +562,7 @@ "@vue/language-core": "2.1.10", "@vue/language-server": "2.1.10", "@vue/typescript-plugin": "2.1.10", - "esbuild": "~0.21.0", + "esbuild": "latest", "esbuild-plugin-copy": "latest", "esbuild-visualizer": "latest", "reactive-vscode": "0.2.7-beta.1", diff --git a/packages/language-core/lib/parsers/scriptSetupRanges.ts b/packages/language-core/lib/parsers/scriptSetupRanges.ts index b4906c45cd..433674d2f1 100644 --- a/packages/language-core/lib/parsers/scriptSetupRanges.ts +++ b/packages/language-core/lib/parsers/scriptSetupRanges.ts @@ -372,7 +372,7 @@ export function parseScriptSetupRanges( } }); for (const prop of node.arguments[0].properties) { - if ((ts.isPropertyAssignment(prop)) && getNodeText(ts, prop.name, ast) === 'name' && ts.isStringLiteral(prop.initializer)) { + if (ts.isPropertyAssignment(prop) && getNodeText(ts, prop.name, ast) === 'name' && ts.isStringLiteral(prop.initializer)) { options.name = prop.initializer.text; } } diff --git a/packages/typescript-plugin/index.ts b/packages/typescript-plugin/index.ts index d79e8d74ea..26fa988a6f 100644 --- a/packages/typescript-plugin/index.ts +++ b/packages/typescript-plugin/index.ts @@ -33,7 +33,7 @@ const plugin = createLanguageServicePlugin( const timer = setInterval(() => { if (info.project['program']) { clearInterval(timer); - (info.project['program'] as any).__vue__ = { language }; + info.project['program'].__vue__ = { language }; } }, 50); } diff --git a/packages/typescript-plugin/lib/server.ts b/packages/typescript-plugin/lib/server.ts index 4f7a3b93fc..c3b83c3f5c 100644 --- a/packages/typescript-plugin/lib/server.ts +++ b/packages/typescript-plugin/lib/server.ts @@ -139,7 +139,7 @@ function tryListen(server: net.Server, namedPipePath: string) { resolve(true); }; const onError = (err: any) => { - if ((err as any).code === 'ECONNREFUSED') { + if (err.code === 'ECONNREFUSED') { try { console.log('[Vue Named Pipe Client] Deleting:', namedPipePath); fs.promises.unlink(namedPipePath); diff --git a/packages/typescript-plugin/lib/utils.ts b/packages/typescript-plugin/lib/utils.ts index 22a8f0bb83..ebc318aec5 100644 --- a/packages/typescript-plugin/lib/utils.ts +++ b/packages/typescript-plugin/lib/utils.ts @@ -99,7 +99,7 @@ export function connect(namedPipePath: string, timeout?: number) { resolve(socket); }; const onError = (err: any) => { - if ((err as any).code === 'ECONNREFUSED') { + if (err.code === 'ECONNREFUSED') { try { console.log('[Vue Named Pipe Client] Deleting:', namedPipePath); fs.promises.unlink(namedPipePath); diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 072b4f4fea..6aa43c5ea6 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -10,25 +10,25 @@ importers: devDependencies: '@lerna-lite/cli': specifier: latest - version: 3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.8.2)(typescript@5.6.3))(@lerna-lite/version@3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.8.2)(typescript@5.6.3))(@types/node@22.8.2)(typescript@5.6.3))(@types/node@22.8.2)(typescript@5.6.3) + version: 3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.9.0)(typescript@5.6.3))(@lerna-lite/version@3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.9.0)(typescript@5.6.3))(@types/node@22.9.0)(typescript@5.6.3))(@types/node@22.9.0)(typescript@5.6.3) '@lerna-lite/publish': specifier: latest - version: 3.10.0(@types/node@22.8.2)(typescript@5.6.3) + version: 3.10.0(@types/node@22.9.0)(typescript@5.6.3) '@tsslint/cli': specifier: latest - version: 1.0.20(typescript@5.6.3) + version: 1.1.3(typescript@5.6.3) '@tsslint/config': specifier: latest - version: 1.0.20 + version: 1.1.3 typescript: specifier: latest version: 5.6.3 vite: specifier: latest - version: 5.4.10(@types/node@22.8.2) + version: 5.4.10(@types/node@22.9.0) vitest: specifier: latest - version: 2.1.4(@types/node@22.8.2) + version: 2.1.4(@types/node@22.9.0) extensions/vscode: devDependencies: @@ -37,7 +37,7 @@ importers: version: 7.5.8 '@types/vscode': specifier: ^1.82.0 - version: 1.94.0 + version: 1.95.0 '@volar/vscode': specifier: ~2.4.8 version: 2.4.8 @@ -54,17 +54,17 @@ importers: specifier: 2.1.10 version: link:../../packages/typescript-plugin esbuild: - specifier: ~0.21.0 - version: 0.21.5 + specifier: latest + version: 0.24.0 esbuild-plugin-copy: specifier: latest - version: 2.1.1(esbuild@0.21.5) + version: 2.1.1(esbuild@0.24.0) esbuild-visualizer: specifier: latest version: 0.6.0 reactive-vscode: specifier: 0.2.7-beta.1 - version: 0.2.7-beta.1(@types/vscode@1.94.0) + version: 0.2.7-beta.1(@types/vscode@1.95.0) semver: specifier: ^7.5.4 version: 7.6.3 @@ -95,7 +95,7 @@ importers: devDependencies: '@types/node': specifier: latest - version: 22.8.2 + version: 22.9.0 '@types/path-browserify': specifier: latest version: 1.0.3 @@ -137,7 +137,7 @@ importers: version: 5.1.2 '@types/node': specifier: latest - version: 22.8.2 + version: 22.9.0 '@types/path-browserify': specifier: ^1.0.1 version: 1.0.3 @@ -159,7 +159,7 @@ importers: devDependencies: '@types/node': specifier: latest - version: 22.8.2 + version: 22.9.0 '@vue/language-core': specifier: 2.1.10 version: link:../language-core @@ -256,7 +256,7 @@ importers: devDependencies: '@types/node': specifier: latest - version: 22.8.2 + version: 22.9.0 '@types/path-browserify': specifier: latest version: 1.0.3 @@ -284,7 +284,7 @@ importers: devDependencies: '@types/node': specifier: latest - version: 22.8.2 + version: 22.9.0 packages/typescript-plugin: dependencies: @@ -300,7 +300,7 @@ importers: devDependencies: '@types/node': specifier: latest - version: 22.8.2 + version: 22.9.0 test-workspace: devDependencies: @@ -369,8 +369,8 @@ packages: resolution: {integrity: sha512-gVPW8YLz92ZeCibQH2QUw96odJoiM3k/ZPH3f2HxptozmH6+OnyyvKXo/Egg39HAM230akarQKHf0W74UHlh0Q==} engines: {node: '>=16'} - '@babel/code-frame@7.26.0': - resolution: {integrity: sha512-INCKxTtbXtcNbUZ3YXutwMpEleqttcswhAdee7dhuoVrD2cnuc3PqtERBtxkX5nziX9vnBL8WXmSGwv8CuPV6g==} + '@babel/code-frame@7.26.2': + resolution: {integrity: sha512-RJlIHRueQgwWitWgF8OdFYGZX328Ax5BCemNGlqHfplnRT9ESi8JkFlvaVYbS+UubVY6dpv87Fs2u5M29iNFVQ==} engines: {node: '>=6.9.0'} '@babel/helper-string-parser@7.25.9': @@ -381,8 +381,8 @@ packages: resolution: {integrity: sha512-Ed61U6XJc3CVRfkERJWDz4dJwKe7iLmmJsbOGu9wSloNSFttHV0I8g6UAgb7qnK5ly5bGLPd4oXZlxCdANBOWQ==} engines: {node: '>=6.9.0'} - '@babel/parser@7.26.1': - resolution: {integrity: sha512-reoQYNiAJreZNsJzyrDNzFQ+IQ5JFiIzAHJg9bn94S3l+4++J7RsIhNMoB+lgP/9tpmiAQqspv+xfdxTSzREOw==} + '@babel/parser@7.26.2': + resolution: {integrity: sha512-DWMCZH9WA4Maitz2q21SRKHo9QXZxkDsbNZoVD62gusNtNBBqDg9i7uOhASfTfIGNzW+O+r7+jAlM8dwphcJKQ==} engines: {node: '>=6.0.0'} hasBin: true @@ -425,8 +425,8 @@ packages: cpu: [ppc64] os: [aix] - '@esbuild/aix-ppc64@0.23.1': - resolution: {integrity: sha512-6VhYk1diRqrhBAqpJEdjASR/+WVRtfjpqKuNw11cLiaWpAT/Uu+nokB+UJnevzy/P9C/ty6AOe0dwueMrGh/iQ==} + '@esbuild/aix-ppc64@0.24.0': + resolution: {integrity: sha512-WtKdFM7ls47zkKHFVzMz8opM7LkcsIp9amDUBIAWirg70RM71WRSjdILPsY5Uv1D42ZpUfaPILDlfactHgsRkw==} engines: {node: '>=18'} cpu: [ppc64] os: [aix] @@ -437,8 +437,8 @@ packages: cpu: [arm64] os: [android] - '@esbuild/android-arm64@0.23.1': - resolution: {integrity: sha512-xw50ipykXcLstLeWH7WRdQuysJqejuAGPd30vd1i5zSyKK3WE+ijzHmLKxdiCMtH1pHz78rOg0BKSYOSB/2Khw==} + '@esbuild/android-arm64@0.24.0': + resolution: {integrity: sha512-Vsm497xFM7tTIPYK9bNTYJyF/lsP590Qc1WxJdlB6ljCbdZKU9SY8i7+Iin4kyhV/KV5J2rOKsBQbB77Ab7L/w==} engines: {node: '>=18'} cpu: [arm64] os: [android] @@ -449,8 +449,8 @@ packages: cpu: [arm] os: [android] - '@esbuild/android-arm@0.23.1': - resolution: {integrity: sha512-uz6/tEy2IFm9RYOyvKl88zdzZfwEfKZmnX9Cj1BHjeSGNuGLuMD1kR8y5bteYmwqKm1tj8m4cb/aKEorr6fHWQ==} + '@esbuild/android-arm@0.24.0': + resolution: {integrity: sha512-arAtTPo76fJ/ICkXWetLCc9EwEHKaeya4vMrReVlEIUCAUncH7M4bhMQ+M9Vf+FFOZJdTNMXNBrWwW+OXWpSew==} engines: {node: '>=18'} cpu: [arm] os: [android] @@ -461,8 +461,8 @@ packages: cpu: [x64] os: [android] - '@esbuild/android-x64@0.23.1': - resolution: {integrity: sha512-nlN9B69St9BwUoB+jkyU090bru8L0NA3yFvAd7k8dNsVH8bi9a8cUAUSEcEEgTp2z3dbEDGJGfP6VUnkQnlReg==} + '@esbuild/android-x64@0.24.0': + resolution: {integrity: sha512-t8GrvnFkiIY7pa7mMgJd7p8p8qqYIz1NYiAoKc75Zyv73L3DZW++oYMSHPRarcotTKuSs6m3hTOa5CKHaS02TQ==} engines: {node: '>=18'} cpu: [x64] os: [android] @@ -473,8 +473,8 @@ packages: cpu: [arm64] os: [darwin] - '@esbuild/darwin-arm64@0.23.1': - resolution: {integrity: sha512-YsS2e3Wtgnw7Wq53XXBLcV6JhRsEq8hkfg91ESVadIrzr9wO6jJDMZnCQbHm1Guc5t/CdDiFSSfWP58FNuvT3Q==} + '@esbuild/darwin-arm64@0.24.0': + resolution: {integrity: sha512-CKyDpRbK1hXwv79soeTJNHb5EiG6ct3efd/FTPdzOWdbZZfGhpbcqIpiD0+vwmpu0wTIL97ZRPZu8vUt46nBSw==} engines: {node: '>=18'} cpu: [arm64] os: [darwin] @@ -485,8 +485,8 @@ packages: cpu: [x64] os: [darwin] - '@esbuild/darwin-x64@0.23.1': - resolution: {integrity: sha512-aClqdgTDVPSEGgoCS8QDG37Gu8yc9lTHNAQlsztQ6ENetKEO//b8y31MMu2ZaPbn4kVsIABzVLXYLhCGekGDqw==} + '@esbuild/darwin-x64@0.24.0': + resolution: {integrity: sha512-rgtz6flkVkh58od4PwTRqxbKH9cOjaXCMZgWD905JOzjFKW+7EiUObfd/Kav+A6Gyud6WZk9w+xu6QLytdi2OA==} engines: {node: '>=18'} cpu: [x64] os: [darwin] @@ -497,8 +497,8 @@ packages: cpu: [arm64] os: [freebsd] - '@esbuild/freebsd-arm64@0.23.1': - resolution: {integrity: sha512-h1k6yS8/pN/NHlMl5+v4XPfikhJulk4G+tKGFIOwURBSFzE8bixw1ebjluLOjfwtLqY0kewfjLSrO6tN2MgIhA==} + '@esbuild/freebsd-arm64@0.24.0': + resolution: {integrity: sha512-6Mtdq5nHggwfDNLAHkPlyLBpE5L6hwsuXZX8XNmHno9JuL2+bg2BX5tRkwjyfn6sKbxZTq68suOjgWqCicvPXA==} engines: {node: '>=18'} cpu: [arm64] os: [freebsd] @@ -509,8 +509,8 @@ packages: cpu: [x64] os: [freebsd] - '@esbuild/freebsd-x64@0.23.1': - resolution: {integrity: sha512-lK1eJeyk1ZX8UklqFd/3A60UuZ/6UVfGT2LuGo3Wp4/z7eRTRYY+0xOu2kpClP+vMTi9wKOfXi2vjUpO1Ro76g==} + '@esbuild/freebsd-x64@0.24.0': + resolution: {integrity: sha512-D3H+xh3/zphoX8ck4S2RxKR6gHlHDXXzOf6f/9dbFt/NRBDIE33+cVa49Kil4WUjxMGW0ZIYBYtaGCa2+OsQwQ==} engines: {node: '>=18'} cpu: [x64] os: [freebsd] @@ -521,8 +521,8 @@ packages: cpu: [arm64] os: [linux] - '@esbuild/linux-arm64@0.23.1': - resolution: {integrity: sha512-/93bf2yxencYDnItMYV/v116zff6UyTjo4EtEQjUBeGiVpMmffDNUyD9UN2zV+V3LRV3/on4xdZ26NKzn6754g==} + '@esbuild/linux-arm64@0.24.0': + resolution: {integrity: sha512-TDijPXTOeE3eaMkRYpcy3LarIg13dS9wWHRdwYRnzlwlA370rNdZqbcp0WTyyV/k2zSxfko52+C7jU5F9Tfj1g==} engines: {node: '>=18'} cpu: [arm64] os: [linux] @@ -533,8 +533,8 @@ packages: cpu: [arm] os: [linux] - '@esbuild/linux-arm@0.23.1': - resolution: {integrity: sha512-CXXkzgn+dXAPs3WBwE+Kvnrf4WECwBdfjfeYHpMeVxWE0EceB6vhWGShs6wi0IYEqMSIzdOF1XjQ/Mkm5d7ZdQ==} + '@esbuild/linux-arm@0.24.0': + resolution: {integrity: sha512-gJKIi2IjRo5G6Glxb8d3DzYXlxdEj2NlkixPsqePSZMhLudqPhtZ4BUrpIuTjJYXxvF9njql+vRjB2oaC9XpBw==} engines: {node: '>=18'} cpu: [arm] os: [linux] @@ -545,8 +545,8 @@ packages: cpu: [ia32] os: [linux] - '@esbuild/linux-ia32@0.23.1': - resolution: {integrity: sha512-VTN4EuOHwXEkXzX5nTvVY4s7E/Krz7COC8xkftbbKRYAl96vPiUssGkeMELQMOnLOJ8k3BY1+ZY52tttZnHcXQ==} + '@esbuild/linux-ia32@0.24.0': + resolution: {integrity: sha512-K40ip1LAcA0byL05TbCQ4yJ4swvnbzHscRmUilrmP9Am7//0UjPreh4lpYzvThT2Quw66MhjG//20mrufm40mA==} engines: {node: '>=18'} cpu: [ia32] os: [linux] @@ -557,8 +557,8 @@ packages: cpu: [loong64] os: [linux] - '@esbuild/linux-loong64@0.23.1': - resolution: {integrity: sha512-Vx09LzEoBa5zDnieH8LSMRToj7ir/Jeq0Gu6qJ/1GcBq9GkfoEAoXvLiW1U9J1qE/Y/Oyaq33w5p2ZWrNNHNEw==} + '@esbuild/linux-loong64@0.24.0': + resolution: {integrity: sha512-0mswrYP/9ai+CU0BzBfPMZ8RVm3RGAN/lmOMgW4aFUSOQBjA31UP8Mr6DDhWSuMwj7jaWOT0p0WoZ6jeHhrD7g==} engines: {node: '>=18'} cpu: [loong64] os: [linux] @@ -569,8 +569,8 @@ packages: cpu: [mips64el] os: [linux] - '@esbuild/linux-mips64el@0.23.1': - resolution: {integrity: sha512-nrFzzMQ7W4WRLNUOU5dlWAqa6yVeI0P78WKGUo7lg2HShq/yx+UYkeNSE0SSfSure0SqgnsxPvmAUu/vu0E+3Q==} + '@esbuild/linux-mips64el@0.24.0': + resolution: {integrity: sha512-hIKvXm0/3w/5+RDtCJeXqMZGkI2s4oMUGj3/jM0QzhgIASWrGO5/RlzAzm5nNh/awHE0A19h/CvHQe6FaBNrRA==} engines: {node: '>=18'} cpu: [mips64el] os: [linux] @@ -581,8 +581,8 @@ packages: cpu: [ppc64] os: [linux] - '@esbuild/linux-ppc64@0.23.1': - resolution: {integrity: sha512-dKN8fgVqd0vUIjxuJI6P/9SSSe/mB9rvA98CSH2sJnlZ/OCZWO1DJvxj8jvKTfYUdGfcq2dDxoKaC6bHuTlgcw==} + '@esbuild/linux-ppc64@0.24.0': + resolution: {integrity: sha512-HcZh5BNq0aC52UoocJxaKORfFODWXZxtBaaZNuN3PUX3MoDsChsZqopzi5UupRhPHSEHotoiptqikjN/B77mYQ==} engines: {node: '>=18'} cpu: [ppc64] os: [linux] @@ -593,8 +593,8 @@ packages: cpu: [riscv64] os: [linux] - '@esbuild/linux-riscv64@0.23.1': - resolution: {integrity: sha512-5AV4Pzp80fhHL83JM6LoA6pTQVWgB1HovMBsLQ9OZWLDqVY8MVobBXNSmAJi//Csh6tcY7e7Lny2Hg1tElMjIA==} + '@esbuild/linux-riscv64@0.24.0': + resolution: {integrity: sha512-bEh7dMn/h3QxeR2KTy1DUszQjUrIHPZKyO6aN1X4BCnhfYhuQqedHaa5MxSQA/06j3GpiIlFGSsy1c7Gf9padw==} engines: {node: '>=18'} cpu: [riscv64] os: [linux] @@ -605,8 +605,8 @@ packages: cpu: [s390x] os: [linux] - '@esbuild/linux-s390x@0.23.1': - resolution: {integrity: sha512-9ygs73tuFCe6f6m/Tb+9LtYxWR4c9yg7zjt2cYkjDbDpV/xVn+68cQxMXCjUpYwEkze2RcU/rMnfIXNRFmSoDw==} + '@esbuild/linux-s390x@0.24.0': + resolution: {integrity: sha512-ZcQ6+qRkw1UcZGPyrCiHHkmBaj9SiCD8Oqd556HldP+QlpUIe2Wgn3ehQGVoPOvZvtHm8HPx+bH20c9pvbkX3g==} engines: {node: '>=18'} cpu: [s390x] os: [linux] @@ -617,8 +617,8 @@ packages: cpu: [x64] os: [linux] - '@esbuild/linux-x64@0.23.1': - resolution: {integrity: sha512-EV6+ovTsEXCPAp58g2dD68LxoP/wK5pRvgy0J/HxPGB009omFPv3Yet0HiaqvrIrgPTBuC6wCH1LTOY91EO5hQ==} + '@esbuild/linux-x64@0.24.0': + resolution: {integrity: sha512-vbutsFqQ+foy3wSSbmjBXXIJ6PL3scghJoM8zCL142cGaZKAdCZHyf+Bpu/MmX9zT9Q0zFBVKb36Ma5Fzfa8xA==} engines: {node: '>=18'} cpu: [x64] os: [linux] @@ -629,14 +629,14 @@ packages: cpu: [x64] os: [netbsd] - '@esbuild/netbsd-x64@0.23.1': - resolution: {integrity: sha512-aevEkCNu7KlPRpYLjwmdcuNz6bDFiE7Z8XC4CPqExjTvrHugh28QzUXVOZtiYghciKUacNktqxdpymplil1beA==} + '@esbuild/netbsd-x64@0.24.0': + resolution: {integrity: sha512-hjQ0R/ulkO8fCYFsG0FZoH+pWgTTDreqpqY7UnQntnaKv95uP5iW3+dChxnx7C3trQQU40S+OgWhUVwCjVFLvg==} engines: {node: '>=18'} cpu: [x64] os: [netbsd] - '@esbuild/openbsd-arm64@0.23.1': - resolution: {integrity: sha512-3x37szhLexNA4bXhLrCC/LImN/YtWis6WXr1VESlfVtVeoFJBRINPJ3f0a/6LV8zpikqoUg4hyXw0sFBt5Cr+Q==} + '@esbuild/openbsd-arm64@0.24.0': + resolution: {integrity: sha512-MD9uzzkPQbYehwcN583yx3Tu5M8EIoTD+tUgKF982WYL9Pf5rKy9ltgD0eUgs8pvKnmizxjXZyLt0z6DC3rRXg==} engines: {node: '>=18'} cpu: [arm64] os: [openbsd] @@ -647,8 +647,8 @@ packages: cpu: [x64] os: [openbsd] - '@esbuild/openbsd-x64@0.23.1': - resolution: {integrity: sha512-aY2gMmKmPhxfU+0EdnN+XNtGbjfQgwZj43k8G3fyrDM/UdZww6xrWxmDkuz2eCZchqVeABjV5BpildOrUbBTqA==} + '@esbuild/openbsd-x64@0.24.0': + resolution: {integrity: sha512-4ir0aY1NGUhIC1hdoCzr1+5b43mw99uNwVzhIq1OY3QcEwPDO3B7WNXBzaKY5Nsf1+N11i1eOfFcq+D/gOS15Q==} engines: {node: '>=18'} cpu: [x64] os: [openbsd] @@ -659,8 +659,8 @@ packages: cpu: [x64] os: [sunos] - '@esbuild/sunos-x64@0.23.1': - resolution: {integrity: sha512-RBRT2gqEl0IKQABT4XTj78tpk9v7ehp+mazn2HbUeZl1YMdaGAQqhapjGTCe7uw7y0frDi4gS0uHzhvpFuI1sA==} + '@esbuild/sunos-x64@0.24.0': + resolution: {integrity: sha512-jVzdzsbM5xrotH+W5f1s+JtUy1UWgjU0Cf4wMvffTB8m6wP5/kx0KiaLHlbJO+dMgtxKV8RQ/JvtlFcdZ1zCPA==} engines: {node: '>=18'} cpu: [x64] os: [sunos] @@ -671,8 +671,8 @@ packages: cpu: [arm64] os: [win32] - '@esbuild/win32-arm64@0.23.1': - resolution: {integrity: sha512-4O+gPR5rEBe2FpKOVyiJ7wNDPA8nGzDuJ6gN4okSA1gEOYZ67N8JPk58tkWtdtPeLz7lBnY6I5L3jdsr3S+A6A==} + '@esbuild/win32-arm64@0.24.0': + resolution: {integrity: sha512-iKc8GAslzRpBytO2/aN3d2yb2z8XTVfNV0PjGlCxKo5SgWmNXx82I/Q3aG1tFfS+A2igVCY97TJ8tnYwpUWLCA==} engines: {node: '>=18'} cpu: [arm64] os: [win32] @@ -683,8 +683,8 @@ packages: cpu: [ia32] os: [win32] - '@esbuild/win32-ia32@0.23.1': - resolution: {integrity: sha512-BcaL0Vn6QwCwre3Y717nVHZbAa4UBEigzFm6VdsVdT/MbZ38xoj1X9HPkZhbmaBGUD1W8vxAfffbDe8bA6AKnQ==} + '@esbuild/win32-ia32@0.24.0': + resolution: {integrity: sha512-vQW36KZolfIudCcTnaTpmLQ24Ha1RjygBo39/aLkM2kmjkWmZGEJ5Gn9l5/7tzXA42QGIoWbICfg6KLLkIw6yw==} engines: {node: '>=18'} cpu: [ia32] os: [win32] @@ -695,8 +695,8 @@ packages: cpu: [x64] os: [win32] - '@esbuild/win32-x64@0.23.1': - resolution: {integrity: sha512-BHpFFeslkWrXWyUPnbKm+xYYVYruCinGcftSBaa8zoF9hZO4BcSCFUvHVTtzpIY6YzUnYtuEhZ+C9iEXjxnasg==} + '@esbuild/win32-x64@0.24.0': + resolution: {integrity: sha512-7IAFPrjSQIJrGsK6flwg7NFmwBoSTyF3rl7If0hNUFQU4ilTsEPL6GuMuU9BfIWVVGuRnuIidkSMC+c0Otu8IA==} engines: {node: '>=18'} cpu: [x64] os: [win32] @@ -927,93 +927,93 @@ packages: '@reactive-vscode/reactivity@0.2.7-beta.1': resolution: {integrity: sha512-ma7DOAFSXhB7h2HLiDrus4as5So1rS3u4zNHKoKCRRh4cBxxnQDFZUUQNafsssM15ggxtf8km5IXyW81ZCWnsg==} - '@rollup/rollup-android-arm-eabi@4.24.2': - resolution: {integrity: sha512-ufoveNTKDg9t/b7nqI3lwbCG/9IJMhADBNjjz/Jn6LxIZxD7T5L8l2uO/wD99945F1Oo8FvgbbZJRguyk/BdzA==} + '@rollup/rollup-android-arm-eabi@4.24.4': + resolution: {integrity: sha512-jfUJrFct/hTA0XDM5p/htWKoNNTbDLY0KRwEt6pyOA6k2fmk0WVwl65PdUdJZgzGEHWx+49LilkcSaumQRyNQw==} cpu: [arm] os: [android] - '@rollup/rollup-android-arm64@4.24.2': - resolution: {integrity: sha512-iZoYCiJz3Uek4NI0J06/ZxUgwAfNzqltK0MptPDO4OR0a88R4h0DSELMsflS6ibMCJ4PnLvq8f7O1d7WexUvIA==} + '@rollup/rollup-android-arm64@4.24.4': + resolution: {integrity: sha512-j4nrEO6nHU1nZUuCfRKoCcvh7PIywQPUCBa2UsootTHvTHIoIu2BzueInGJhhvQO/2FTRdNYpf63xsgEqH9IhA==} cpu: [arm64] os: [android] - '@rollup/rollup-darwin-arm64@4.24.2': - resolution: {integrity: sha512-/UhrIxobHYCBfhi5paTkUDQ0w+jckjRZDZ1kcBL132WeHZQ6+S5v9jQPVGLVrLbNUebdIRpIt00lQ+4Z7ys4Rg==} + '@rollup/rollup-darwin-arm64@4.24.4': + resolution: {integrity: sha512-GmU/QgGtBTeraKyldC7cDVVvAJEOr3dFLKneez/n7BvX57UdhOqDsVwzU7UOnYA7AAOt+Xb26lk79PldDHgMIQ==} cpu: [arm64] os: [darwin] - '@rollup/rollup-darwin-x64@4.24.2': - resolution: {integrity: sha512-1F/jrfhxJtWILusgx63WeTvGTwE4vmsT9+e/z7cZLKU8sBMddwqw3UV5ERfOV+H1FuRK3YREZ46J4Gy0aP3qDA==} + '@rollup/rollup-darwin-x64@4.24.4': + resolution: {integrity: sha512-N6oDBiZCBKlwYcsEPXGDE4g9RoxZLK6vT98M8111cW7VsVJFpNEqvJeIPfsCzbf0XEakPslh72X0gnlMi4Ddgg==} cpu: [x64] os: [darwin] - '@rollup/rollup-freebsd-arm64@4.24.2': - resolution: {integrity: sha512-1YWOpFcGuC6iGAS4EI+o3BV2/6S0H+m9kFOIlyFtp4xIX5rjSnL3AwbTBxROX0c8yWtiWM7ZI6mEPTI7VkSpZw==} + '@rollup/rollup-freebsd-arm64@4.24.4': + resolution: {integrity: sha512-py5oNShCCjCyjWXCZNrRGRpjWsF0ic8f4ieBNra5buQz0O/U6mMXCpC1LvrHuhJsNPgRt36tSYMidGzZiJF6mw==} cpu: [arm64] os: [freebsd] - '@rollup/rollup-freebsd-x64@4.24.2': - resolution: {integrity: sha512-3qAqTewYrCdnOD9Gl9yvPoAoFAVmPJsBvleabvx4bnu1Kt6DrB2OALeRVag7BdWGWLhP1yooeMLEi6r2nYSOjg==} + '@rollup/rollup-freebsd-x64@4.24.4': + resolution: {integrity: sha512-L7VVVW9FCnTTp4i7KrmHeDsDvjB4++KOBENYtNYAiYl96jeBThFfhP6HVxL74v4SiZEVDH/1ILscR5U9S4ms4g==} cpu: [x64] os: [freebsd] - '@rollup/rollup-linux-arm-gnueabihf@4.24.2': - resolution: {integrity: sha512-ArdGtPHjLqWkqQuoVQ6a5UC5ebdX8INPuJuJNWRe0RGa/YNhVvxeWmCTFQ7LdmNCSUzVZzxAvUznKaYx645Rig==} + '@rollup/rollup-linux-arm-gnueabihf@4.24.4': + resolution: {integrity: sha512-10ICosOwYChROdQoQo589N5idQIisxjaFE/PAnX2i0Zr84mY0k9zul1ArH0rnJ/fpgiqfu13TFZR5A5YJLOYZA==} cpu: [arm] os: [linux] - '@rollup/rollup-linux-arm-musleabihf@4.24.2': - resolution: {integrity: sha512-B6UHHeNnnih8xH6wRKB0mOcJGvjZTww1FV59HqJoTJ5da9LCG6R4SEBt6uPqzlawv1LoEXSS0d4fBlHNWl6iYw==} + '@rollup/rollup-linux-arm-musleabihf@4.24.4': + resolution: {integrity: sha512-ySAfWs69LYC7QhRDZNKqNhz2UKN8LDfbKSMAEtoEI0jitwfAG2iZwVqGACJT+kfYvvz3/JgsLlcBP+WWoKCLcw==} cpu: [arm] os: [linux] - '@rollup/rollup-linux-arm64-gnu@4.24.2': - resolution: {integrity: sha512-kr3gqzczJjSAncwOS6i7fpb4dlqcvLidqrX5hpGBIM1wtt0QEVtf4wFaAwVv8QygFU8iWUMYEoJZWuWxyua4GQ==} + '@rollup/rollup-linux-arm64-gnu@4.24.4': + resolution: {integrity: sha512-uHYJ0HNOI6pGEeZ/5mgm5arNVTI0nLlmrbdph+pGXpC9tFHFDQmDMOEqkmUObRfosJqpU8RliYoGz06qSdtcjg==} cpu: [arm64] os: [linux] - '@rollup/rollup-linux-arm64-musl@4.24.2': - resolution: {integrity: sha512-TDdHLKCWgPuq9vQcmyLrhg/bgbOvIQ8rtWQK7MRxJ9nvaxKx38NvY7/Lo6cYuEnNHqf6rMqnivOIPIQt6H2AoA==} + '@rollup/rollup-linux-arm64-musl@4.24.4': + resolution: {integrity: sha512-38yiWLemQf7aLHDgTg85fh3hW9stJ0Muk7+s6tIkSUOMmi4Xbv5pH/5Bofnsb6spIwD5FJiR+jg71f0CH5OzoA==} cpu: [arm64] os: [linux] - '@rollup/rollup-linux-powerpc64le-gnu@4.24.2': - resolution: {integrity: sha512-xv9vS648T3X4AxFFZGWeB5Dou8ilsv4VVqJ0+loOIgDO20zIhYfDLkk5xoQiej2RiSQkld9ijF/fhLeonrz2mw==} + '@rollup/rollup-linux-powerpc64le-gnu@4.24.4': + resolution: {integrity: sha512-q73XUPnkwt9ZNF2xRS4fvneSuaHw2BXuV5rI4cw0fWYVIWIBeDZX7c7FWhFQPNTnE24172K30I+dViWRVD9TwA==} cpu: [ppc64] os: [linux] - '@rollup/rollup-linux-riscv64-gnu@4.24.2': - resolution: {integrity: sha512-tbtXwnofRoTt223WUZYiUnbxhGAOVul/3StZ947U4A5NNjnQJV5irKMm76G0LGItWs6y+SCjUn/Q0WaMLkEskg==} + '@rollup/rollup-linux-riscv64-gnu@4.24.4': + resolution: {integrity: sha512-Aie/TbmQi6UXokJqDZdmTJuZBCU3QBDA8oTKRGtd4ABi/nHgXICulfg1KI6n9/koDsiDbvHAiQO3YAUNa/7BCw==} cpu: [riscv64] os: [linux] - '@rollup/rollup-linux-s390x-gnu@4.24.2': - resolution: {integrity: sha512-gc97UebApwdsSNT3q79glOSPdfwgwj5ELuiyuiMY3pEWMxeVqLGKfpDFoum4ujivzxn6veUPzkGuSYoh5deQ2Q==} + '@rollup/rollup-linux-s390x-gnu@4.24.4': + resolution: {integrity: sha512-P8MPErVO/y8ohWSP9JY7lLQ8+YMHfTI4bAdtCi3pC2hTeqFJco2jYspzOzTUB8hwUWIIu1xwOrJE11nP+0JFAQ==} cpu: [s390x] os: [linux] - '@rollup/rollup-linux-x64-gnu@4.24.2': - resolution: {integrity: sha512-jOG/0nXb3z+EM6SioY8RofqqmZ+9NKYvJ6QQaa9Mvd3RQxlH68/jcB/lpyVt4lCiqr04IyaC34NzhUqcXbB5FQ==} + '@rollup/rollup-linux-x64-gnu@4.24.4': + resolution: {integrity: sha512-K03TljaaoPK5FOyNMZAAEmhlyO49LaE4qCsr0lYHUKyb6QacTNF9pnfPpXnFlFD3TXuFbFbz7tJ51FujUXkXYA==} cpu: [x64] os: [linux] - '@rollup/rollup-linux-x64-musl@4.24.2': - resolution: {integrity: sha512-XAo7cJec80NWx9LlZFEJQxqKOMz/lX3geWs2iNT5CHIERLFfd90f3RYLLjiCBm1IMaQ4VOX/lTC9lWfzzQm14Q==} + '@rollup/rollup-linux-x64-musl@4.24.4': + resolution: {integrity: sha512-VJYl4xSl/wqG2D5xTYncVWW+26ICV4wubwN9Gs5NrqhJtayikwCXzPL8GDsLnaLU3WwhQ8W02IinYSFJfyo34Q==} cpu: [x64] os: [linux] - '@rollup/rollup-win32-arm64-msvc@4.24.2': - resolution: {integrity: sha512-A+JAs4+EhsTjnPQvo9XY/DC0ztaws3vfqzrMNMKlwQXuniBKOIIvAAI8M0fBYiTCxQnElYu7mLk7JrhlQ+HeOw==} + '@rollup/rollup-win32-arm64-msvc@4.24.4': + resolution: {integrity: sha512-ku2GvtPwQfCqoPFIJCqZ8o7bJcj+Y54cZSr43hHca6jLwAiCbZdBUOrqE6y29QFajNAzzpIOwsckaTFmN6/8TA==} cpu: [arm64] os: [win32] - '@rollup/rollup-win32-ia32-msvc@4.24.2': - resolution: {integrity: sha512-ZhcrakbqA1SCiJRMKSU64AZcYzlZ/9M5LaYil9QWxx9vLnkQ9Vnkve17Qn4SjlipqIIBFKjBES6Zxhnvh0EAEw==} + '@rollup/rollup-win32-ia32-msvc@4.24.4': + resolution: {integrity: sha512-V3nCe+eTt/W6UYNr/wGvO1fLpHUrnlirlypZfKCT1fG6hWfqhPgQV/K/mRBXBpxc0eKLIF18pIOFVPh0mqHjlg==} cpu: [ia32] os: [win32] - '@rollup/rollup-win32-x64-msvc@4.24.2': - resolution: {integrity: sha512-2mLH46K1u3r6uwc95hU+OR9q/ggYMpnS7pSp83Ece1HUQgF9Nh/QwTK5rcgbFnV9j+08yBrU5sA/P0RK2MSBNA==} + '@rollup/rollup-win32-x64-msvc@4.24.4': + resolution: {integrity: sha512-LTw1Dfd0mBIEqUVCxbvTE/LLo+9ZxVC9k99v1v4ahg9Aak6FpqOfNu5kRkeTAn0wphoC4JU7No1/rL+bBCEwhg==} cpu: [x64] os: [win32] @@ -1044,20 +1044,20 @@ packages: resolution: {integrity: sha512-8iKx79/F73DKbGfRf7+t4dqrc0bRr0thdPrxAtCKWRm/F0tG71i6O1rvlnScncJLLBZHn3h8M3c1BSUAb9yu8g==} engines: {node: ^16.14.0 || >=18.0.0} - '@tsslint/cli@1.0.20': - resolution: {integrity: sha512-pXsjia1GsYXyxQI7yaSHyTcRo5bOP4thVvZsFZ813Od1NRshWLOfOu+VOxNjxvQJcXdmSZNWLWeod0kdTAy3wA==} + '@tsslint/cli@1.1.3': + resolution: {integrity: sha512-6W2ARpGowGQf0a/0nlo4dOveJ2Lg62HDVrXzofT+PRbb4LAP7McjzvOrmZA+FRfnzCrPehX+ZT1XT9RvKHYCsg==} hasBin: true peerDependencies: typescript: '*' - '@tsslint/config@1.0.20': - resolution: {integrity: sha512-bMkSokaF8QnKXClmuI9v2e9RooFlQuIYIS0feGETz4EYgM0UDBhBbjYY94uZzQ3duS08hg1MoouH3pYljjsgDg==} + '@tsslint/config@1.1.3': + resolution: {integrity: sha512-ZttaRm/UAUM9G5ZRwczRx+PW81w4tG1JBIp2cAT9ad0CXLWs+H78DCd2fq3F+iXDys/pE4UB+OzLi+EIiJaYBQ==} - '@tsslint/core@1.0.20': - resolution: {integrity: sha512-PF5jEDh9tfGGzPihZ09Wf4r35mql9MpcCXm82zRIwVdHmBH0H2TBcH5K/NavHlEag3RodEBl3IcBAEOH+gPVsg==} + '@tsslint/core@1.1.3': + resolution: {integrity: sha512-bi7gVuCsdEs8HA/kT9xzNwX/xWgih5/vRV5oDDikqEsyMp7AnAd//XPangPgVe1VegtMeN9xLAwdSZJJt4zvIg==} - '@tsslint/types@1.0.20': - resolution: {integrity: sha512-koi8F0hrzlRDoFI3jPjqxvTzjlU21X3EImRctOkxaGZm0b1FKWAkyU6kuEiY1TalAkpeWnJegpSlQsCMJ3cGnA==} + '@tsslint/types@1.1.3': + resolution: {integrity: sha512-MNrRUtnMuP4epzV+uc4j1n+1dMIk3xe3XFfzCLIFDiNBzWzV59BSyEDOgsniewY5XTZEg6fWvccqs0wVp1hS/g==} '@tufjs/canonical-json@2.0.0': resolution: {integrity: sha512-yVtV8zsdo8qFHe+/3kw81dSLyF7D576A5cCFCi4X7B39tWT7SekaEFUnvnWJHz+9qO7qJTah1JbrDjWKqFtdWA==} @@ -1073,8 +1073,8 @@ packages: '@types/minimatch@5.1.2': resolution: {integrity: sha512-K0VQKziLUWkVKiRVrx4a40iPaxTUefQmjtkQofBkYRcoaaL/8rhwDWww9qWbrgicNOgnpIsMxyNIUM4+n6dUIA==} - '@types/node@22.8.2': - resolution: {integrity: sha512-NzaRNFV+FZkvK/KLCsNdTvID0SThyrs5SHB6tsD/lajr22FGC73N2QeDPM2wHtVde8mgcXuSsHQkH5cX1pbPLw==} + '@types/node@22.9.0': + resolution: {integrity: sha512-vuyHg81vvWA1Z1ELfvLko2c8f34gyA0zaic0+Rllc5lbCnbSyuvb2Oxpm6TAUAC/2xZN3QGqxBNggD1nNR2AfQ==} '@types/normalize-package-data@2.4.4': resolution: {integrity: sha512-37i+OaWTh9qeK4LSHPsyRC7NahnGotNuZvjLSgcPzblpHB3rrCJxAOgI5gCdKm7coonsaX1Of0ILiTcnZjbfxA==} @@ -1085,8 +1085,8 @@ packages: '@types/semver@7.5.8': resolution: {integrity: sha512-I8EUhyrgfLrcTkzV3TSsGyl1tSuPrEDzr0yd5m90UgNxQkyDXULk3b6MlQqTCpZpNtWe1K0hzclnZkTcLBe2UQ==} - '@types/vscode@1.94.0': - resolution: {integrity: sha512-UyQOIUT0pb14XSqJskYnRwD2aG0QrPVefIfrW1djR+/J4KeFQ0i1+hjZoaAmeNf3Z2jleK+R2hv+EboG/m8ruw==} + '@types/vscode@1.95.0': + resolution: {integrity: sha512-0LBD8TEiNbet3NvWsmn59zLzOFu/txSlGxnv5yAFHCrhG9WvAnR3IvfHzMOs2aeWqgvNjq9pO99IUw8d3n+unw==} '@vitest/expect@2.1.4': resolution: {integrity: sha512-DOETT0Oh1avie/D/o2sgMHGrzYUFFo3zqESB2Hn70z6QB1HrS2IQ9z5DfyTqU8sg4Bpu13zZe9V4+UTNQlUeQA==} @@ -1755,8 +1755,8 @@ packages: engines: {node: '>=12'} hasBin: true - esbuild@0.23.1: - resolution: {integrity: sha512-VVNz/9Sa0bs5SELtn3f7qhJCDPCF5oMEl5cO9/SSinpE9hbPVvxbd572HH5AKiP7WD8INO53GgfDDhRjkylHEg==} + esbuild@0.24.0: + resolution: {integrity: sha512-FuLPevChGDshgSicjisSooU0cemp/sGXR841D5LHMB7mTVOmsEHcAxaH3irL53+8YDIeVNQEySh4DaYU/iuPqQ==} engines: {node: '>=18'} hasBin: true @@ -2272,8 +2272,8 @@ packages: lru-cache@10.4.3: resolution: {integrity: sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==} - lru-cache@11.0.1: - resolution: {integrity: sha512-CgeuL5uom6j/ZVrg7G/+1IXqRY8JXX4Hghfy5YE0EhoYQWvndP1kufu58cmZLNIDKnRhZrXfdS9urVWx98AipQ==} + lru-cache@11.0.2: + resolution: {integrity: sha512-123qHRfJBmo2jXDbo/a5YOQrJoHF/GNQTLzQ5+IdK5pWpceK17yRc6ozlWd25FxvGKQbIUs91fDFkXmDHTKcyA==} engines: {node: 20 || >=22} lru-cache@6.0.0: @@ -2814,8 +2814,8 @@ packages: resolution: {integrity: sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==} engines: {iojs: '>=1.0.0', node: '>=0.10.0'} - rollup@4.24.2: - resolution: {integrity: sha512-do/DFGq5g6rdDhdpPq5qb2ecoczeK6y+2UAjdJ5trjQJj5f1AiVdLRWRc9A9/fFukfvJRgM0UXzxBIYMovm5ww==} + rollup@4.24.4: + resolution: {integrity: sha512-vGorVWIsWfX3xbcyAS+I047kFKapHYivmkaT63Smj77XwvLSJos6M1xGqZnBPFQFBRZDOcG1QnYEIxAvTr/HjA==} engines: {node: '>=18.0.0', npm: '>=8.0.0'} hasBin: true @@ -3064,8 +3064,8 @@ packages: resolution: {integrity: sha512-gcANaAnd2QDZFmHFEOF4k7uc1J/6a6z3DJMd/QwEyxLoKGiptJRwid582r7QIsFlFMIZ3SnxfS52S4hm2DHkuQ==} engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0} - tslib@2.8.0: - resolution: {integrity: sha512-jWVzBLplnCmoaTr13V9dYbiQ99wvZRd0vNWaDRg+aVYRcjDF3nDksxFDE/+fkXnKhpnUUkmx5pK/v8mCtLVqZA==} + tslib@2.8.1: + resolution: {integrity: sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==} tuf-js@2.2.1: resolution: {integrity: sha512-GwIJau9XaA8nLVbUXsN3IlFi7WmQ48gBUrl3FTkkL/XLu/POhBzfmX9hd33FNMX1qAsfl6ozO1iMmW9NC8YniA==} @@ -3470,13 +3470,13 @@ snapshots: '@azure/abort-controller@2.1.2': dependencies: - tslib: 2.8.0 + tslib: 2.8.1 '@azure/core-auth@1.9.0': dependencies: '@azure/abort-controller': 2.1.2 '@azure/core-util': 1.11.0 - tslib: 2.8.0 + tslib: 2.8.1 '@azure/core-client@1.9.2': dependencies: @@ -3486,7 +3486,7 @@ snapshots: '@azure/core-tracing': 1.2.0 '@azure/core-util': 1.11.0 '@azure/logger': 1.1.4 - tslib: 2.8.0 + tslib: 2.8.1 transitivePeerDependencies: - supports-color @@ -3499,18 +3499,18 @@ snapshots: '@azure/logger': 1.1.4 http-proxy-agent: 7.0.2 https-proxy-agent: 7.0.5 - tslib: 2.8.0 + tslib: 2.8.1 transitivePeerDependencies: - supports-color '@azure/core-tracing@1.2.0': dependencies: - tslib: 2.8.0 + tslib: 2.8.1 '@azure/core-util@1.11.0': dependencies: '@azure/abort-controller': 2.1.2 - tslib: 2.8.0 + tslib: 2.8.1 '@azure/identity@4.5.0': dependencies: @@ -3527,13 +3527,13 @@ snapshots: jws: 4.0.0 open: 8.4.2 stoppable: 1.1.0 - tslib: 2.8.0 + tslib: 2.8.1 transitivePeerDependencies: - supports-color '@azure/logger@1.1.4': dependencies: - tslib: 2.8.0 + tslib: 2.8.1 '@azure/msal-browser@3.26.1': dependencies: @@ -3547,7 +3547,7 @@ snapshots: jsonwebtoken: 9.0.2 uuid: 8.3.2 - '@babel/code-frame@7.26.0': + '@babel/code-frame@7.26.2': dependencies: '@babel/helper-validator-identifier': 7.25.9 js-tokens: 4.0.0 @@ -3557,7 +3557,7 @@ snapshots: '@babel/helper-validator-identifier@7.25.9': {} - '@babel/parser@7.26.1': + '@babel/parser@7.26.2': dependencies: '@babel/types': 7.26.0 @@ -3603,150 +3603,150 @@ snapshots: '@esbuild/aix-ppc64@0.21.5': optional: true - '@esbuild/aix-ppc64@0.23.1': + '@esbuild/aix-ppc64@0.24.0': optional: true '@esbuild/android-arm64@0.21.5': optional: true - '@esbuild/android-arm64@0.23.1': + '@esbuild/android-arm64@0.24.0': optional: true '@esbuild/android-arm@0.21.5': optional: true - '@esbuild/android-arm@0.23.1': + '@esbuild/android-arm@0.24.0': optional: true '@esbuild/android-x64@0.21.5': optional: true - '@esbuild/android-x64@0.23.1': + '@esbuild/android-x64@0.24.0': optional: true '@esbuild/darwin-arm64@0.21.5': optional: true - '@esbuild/darwin-arm64@0.23.1': + '@esbuild/darwin-arm64@0.24.0': optional: true '@esbuild/darwin-x64@0.21.5': optional: true - '@esbuild/darwin-x64@0.23.1': + '@esbuild/darwin-x64@0.24.0': optional: true '@esbuild/freebsd-arm64@0.21.5': optional: true - '@esbuild/freebsd-arm64@0.23.1': + '@esbuild/freebsd-arm64@0.24.0': optional: true '@esbuild/freebsd-x64@0.21.5': optional: true - '@esbuild/freebsd-x64@0.23.1': + '@esbuild/freebsd-x64@0.24.0': optional: true '@esbuild/linux-arm64@0.21.5': optional: true - '@esbuild/linux-arm64@0.23.1': + '@esbuild/linux-arm64@0.24.0': optional: true '@esbuild/linux-arm@0.21.5': optional: true - '@esbuild/linux-arm@0.23.1': + '@esbuild/linux-arm@0.24.0': optional: true '@esbuild/linux-ia32@0.21.5': optional: true - '@esbuild/linux-ia32@0.23.1': + '@esbuild/linux-ia32@0.24.0': optional: true '@esbuild/linux-loong64@0.21.5': optional: true - '@esbuild/linux-loong64@0.23.1': + '@esbuild/linux-loong64@0.24.0': optional: true '@esbuild/linux-mips64el@0.21.5': optional: true - '@esbuild/linux-mips64el@0.23.1': + '@esbuild/linux-mips64el@0.24.0': optional: true '@esbuild/linux-ppc64@0.21.5': optional: true - '@esbuild/linux-ppc64@0.23.1': + '@esbuild/linux-ppc64@0.24.0': optional: true '@esbuild/linux-riscv64@0.21.5': optional: true - '@esbuild/linux-riscv64@0.23.1': + '@esbuild/linux-riscv64@0.24.0': optional: true '@esbuild/linux-s390x@0.21.5': optional: true - '@esbuild/linux-s390x@0.23.1': + '@esbuild/linux-s390x@0.24.0': optional: true '@esbuild/linux-x64@0.21.5': optional: true - '@esbuild/linux-x64@0.23.1': + '@esbuild/linux-x64@0.24.0': optional: true '@esbuild/netbsd-x64@0.21.5': optional: true - '@esbuild/netbsd-x64@0.23.1': + '@esbuild/netbsd-x64@0.24.0': optional: true - '@esbuild/openbsd-arm64@0.23.1': + '@esbuild/openbsd-arm64@0.24.0': optional: true '@esbuild/openbsd-x64@0.21.5': optional: true - '@esbuild/openbsd-x64@0.23.1': + '@esbuild/openbsd-x64@0.24.0': optional: true '@esbuild/sunos-x64@0.21.5': optional: true - '@esbuild/sunos-x64@0.23.1': + '@esbuild/sunos-x64@0.24.0': optional: true '@esbuild/win32-arm64@0.21.5': optional: true - '@esbuild/win32-arm64@0.23.1': + '@esbuild/win32-arm64@0.24.0': optional: true '@esbuild/win32-ia32@0.21.5': optional: true - '@esbuild/win32-ia32@0.23.1': + '@esbuild/win32-ia32@0.24.0': optional: true '@esbuild/win32-x64@0.21.5': optional: true - '@esbuild/win32-x64@0.23.1': + '@esbuild/win32-x64@0.24.0': optional: true '@hutson/parse-repository-url@5.0.0': {} - '@inquirer/core@10.0.1(@types/node@22.8.2)': + '@inquirer/core@10.0.1(@types/node@22.9.0)': dependencies: '@inquirer/figures': 1.0.7 - '@inquirer/type': 3.0.0(@types/node@22.8.2) + '@inquirer/type': 3.0.0(@types/node@22.9.0) ansi-escapes: 4.3.2 cli-width: 4.1.0 mute-stream: 2.0.0 @@ -3757,33 +3757,33 @@ snapshots: transitivePeerDependencies: - '@types/node' - '@inquirer/expand@4.0.1(@types/node@22.8.2)': + '@inquirer/expand@4.0.1(@types/node@22.9.0)': dependencies: - '@inquirer/core': 10.0.1(@types/node@22.8.2) - '@inquirer/type': 3.0.0(@types/node@22.8.2) - '@types/node': 22.8.2 + '@inquirer/core': 10.0.1(@types/node@22.9.0) + '@inquirer/type': 3.0.0(@types/node@22.9.0) + '@types/node': 22.9.0 yoctocolors-cjs: 2.1.2 '@inquirer/figures@1.0.7': {} - '@inquirer/input@4.0.1(@types/node@22.8.2)': + '@inquirer/input@4.0.1(@types/node@22.9.0)': dependencies: - '@inquirer/core': 10.0.1(@types/node@22.8.2) - '@inquirer/type': 3.0.0(@types/node@22.8.2) - '@types/node': 22.8.2 + '@inquirer/core': 10.0.1(@types/node@22.9.0) + '@inquirer/type': 3.0.0(@types/node@22.9.0) + '@types/node': 22.9.0 - '@inquirer/select@4.0.1(@types/node@22.8.2)': + '@inquirer/select@4.0.1(@types/node@22.9.0)': dependencies: - '@inquirer/core': 10.0.1(@types/node@22.8.2) + '@inquirer/core': 10.0.1(@types/node@22.9.0) '@inquirer/figures': 1.0.7 - '@inquirer/type': 3.0.0(@types/node@22.8.2) - '@types/node': 22.8.2 + '@inquirer/type': 3.0.0(@types/node@22.9.0) + '@types/node': 22.9.0 ansi-escapes: 4.3.2 yoctocolors-cjs: 2.1.2 - '@inquirer/type@3.0.0(@types/node@22.8.2)': + '@inquirer/type@3.0.0(@types/node@22.9.0)': dependencies: - '@types/node': 22.8.2 + '@types/node': 22.9.0 '@isaacs/cliui@8.0.2': dependencies: @@ -3800,10 +3800,10 @@ snapshots: '@jridgewell/sourcemap-codec@1.5.0': {} - '@lerna-lite/cli@3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.8.2)(typescript@5.6.3))(@lerna-lite/version@3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.8.2)(typescript@5.6.3))(@types/node@22.8.2)(typescript@5.6.3))(@types/node@22.8.2)(typescript@5.6.3)': + '@lerna-lite/cli@3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.9.0)(typescript@5.6.3))(@lerna-lite/version@3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.9.0)(typescript@5.6.3))(@types/node@22.9.0)(typescript@5.6.3))(@types/node@22.9.0)(typescript@5.6.3)': dependencies: - '@lerna-lite/core': 3.10.0(@types/node@22.8.2)(typescript@5.6.3) - '@lerna-lite/init': 3.10.0(@types/node@22.8.2)(typescript@5.6.3) + '@lerna-lite/core': 3.10.0(@types/node@22.9.0)(typescript@5.6.3) + '@lerna-lite/init': 3.10.0(@types/node@22.9.0)(typescript@5.6.3) '@lerna-lite/npmlog': 3.10.0 dedent: 1.5.3 dotenv: 16.4.5 @@ -3811,8 +3811,8 @@ snapshots: load-json-file: 7.0.1 yargs: 17.7.2 optionalDependencies: - '@lerna-lite/publish': 3.10.0(@types/node@22.8.2)(typescript@5.6.3) - '@lerna-lite/version': 3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.8.2)(typescript@5.6.3))(@types/node@22.8.2)(typescript@5.6.3) + '@lerna-lite/publish': 3.10.0(@types/node@22.9.0)(typescript@5.6.3) + '@lerna-lite/version': 3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.9.0)(typescript@5.6.3))(@types/node@22.9.0)(typescript@5.6.3) transitivePeerDependencies: - '@types/node' - babel-plugin-macros @@ -3820,11 +3820,11 @@ snapshots: - supports-color - typescript - '@lerna-lite/core@3.10.0(@types/node@22.8.2)(typescript@5.6.3)': + '@lerna-lite/core@3.10.0(@types/node@22.9.0)(typescript@5.6.3)': dependencies: - '@inquirer/expand': 4.0.1(@types/node@22.8.2) - '@inquirer/input': 4.0.1(@types/node@22.8.2) - '@inquirer/select': 4.0.1(@types/node@22.8.2) + '@inquirer/expand': 4.0.1(@types/node@22.9.0) + '@inquirer/input': 4.0.1(@types/node@22.9.0) + '@inquirer/select': 4.0.1(@types/node@22.9.0) '@lerna-lite/npmlog': 3.10.0 '@npmcli/run-script': 8.1.0 clone-deep: 4.0.1 @@ -3858,9 +3858,9 @@ snapshots: - supports-color - typescript - '@lerna-lite/init@3.10.0(@types/node@22.8.2)(typescript@5.6.3)': + '@lerna-lite/init@3.10.0(@types/node@22.9.0)(typescript@5.6.3)': dependencies: - '@lerna-lite/core': 3.10.0(@types/node@22.8.2)(typescript@5.6.3) + '@lerna-lite/core': 3.10.0(@types/node@22.9.0)(typescript@5.6.3) fs-extra: 11.2.0 p-map: 7.0.2 write-json-file: 6.0.0 @@ -3883,12 +3883,12 @@ snapshots: strip-ansi: 7.1.0 wide-align: 1.1.5 - '@lerna-lite/publish@3.10.0(@types/node@22.8.2)(typescript@5.6.3)': + '@lerna-lite/publish@3.10.0(@types/node@22.9.0)(typescript@5.6.3)': dependencies: - '@lerna-lite/cli': 3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.8.2)(typescript@5.6.3))(@lerna-lite/version@3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.8.2)(typescript@5.6.3))(@types/node@22.8.2)(typescript@5.6.3))(@types/node@22.8.2)(typescript@5.6.3) - '@lerna-lite/core': 3.10.0(@types/node@22.8.2)(typescript@5.6.3) + '@lerna-lite/cli': 3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.9.0)(typescript@5.6.3))(@lerna-lite/version@3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.9.0)(typescript@5.6.3))(@types/node@22.9.0)(typescript@5.6.3))(@types/node@22.9.0)(typescript@5.6.3) + '@lerna-lite/core': 3.10.0(@types/node@22.9.0)(typescript@5.6.3) '@lerna-lite/npmlog': 3.10.0 - '@lerna-lite/version': 3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.8.2)(typescript@5.6.3))(@types/node@22.8.2)(typescript@5.6.3) + '@lerna-lite/version': 3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.9.0)(typescript@5.6.3))(@types/node@22.9.0)(typescript@5.6.3) '@npmcli/arborist': 7.5.4 '@npmcli/package-json': 5.2.1 byte-size: 9.0.0 @@ -3921,10 +3921,10 @@ snapshots: - supports-color - typescript - '@lerna-lite/version@3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.8.2)(typescript@5.6.3))(@types/node@22.8.2)(typescript@5.6.3)': + '@lerna-lite/version@3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.9.0)(typescript@5.6.3))(@types/node@22.9.0)(typescript@5.6.3)': dependencies: - '@lerna-lite/cli': 3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.8.2)(typescript@5.6.3))(@lerna-lite/version@3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.8.2)(typescript@5.6.3))(@types/node@22.8.2)(typescript@5.6.3))(@types/node@22.8.2)(typescript@5.6.3) - '@lerna-lite/core': 3.10.0(@types/node@22.8.2)(typescript@5.6.3) + '@lerna-lite/cli': 3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.9.0)(typescript@5.6.3))(@lerna-lite/version@3.10.0(@lerna-lite/publish@3.10.0(@types/node@22.9.0)(typescript@5.6.3))(@types/node@22.9.0)(typescript@5.6.3))(@types/node@22.9.0)(typescript@5.6.3) + '@lerna-lite/core': 3.10.0(@types/node@22.9.0)(typescript@5.6.3) '@lerna-lite/npmlog': 3.10.0 '@octokit/plugin-enterprise-rest': 6.0.1 '@octokit/rest': 21.0.2 @@ -4178,58 +4178,58 @@ snapshots: '@reactive-vscode/reactivity@0.2.7-beta.1': {} - '@rollup/rollup-android-arm-eabi@4.24.2': + '@rollup/rollup-android-arm-eabi@4.24.4': optional: true - '@rollup/rollup-android-arm64@4.24.2': + '@rollup/rollup-android-arm64@4.24.4': optional: true - '@rollup/rollup-darwin-arm64@4.24.2': + '@rollup/rollup-darwin-arm64@4.24.4': optional: true - '@rollup/rollup-darwin-x64@4.24.2': + '@rollup/rollup-darwin-x64@4.24.4': optional: true - '@rollup/rollup-freebsd-arm64@4.24.2': + '@rollup/rollup-freebsd-arm64@4.24.4': optional: true - '@rollup/rollup-freebsd-x64@4.24.2': + '@rollup/rollup-freebsd-x64@4.24.4': optional: true - '@rollup/rollup-linux-arm-gnueabihf@4.24.2': + '@rollup/rollup-linux-arm-gnueabihf@4.24.4': optional: true - '@rollup/rollup-linux-arm-musleabihf@4.24.2': + '@rollup/rollup-linux-arm-musleabihf@4.24.4': optional: true - '@rollup/rollup-linux-arm64-gnu@4.24.2': + '@rollup/rollup-linux-arm64-gnu@4.24.4': optional: true - '@rollup/rollup-linux-arm64-musl@4.24.2': + '@rollup/rollup-linux-arm64-musl@4.24.4': optional: true - '@rollup/rollup-linux-powerpc64le-gnu@4.24.2': + '@rollup/rollup-linux-powerpc64le-gnu@4.24.4': optional: true - '@rollup/rollup-linux-riscv64-gnu@4.24.2': + '@rollup/rollup-linux-riscv64-gnu@4.24.4': optional: true - '@rollup/rollup-linux-s390x-gnu@4.24.2': + '@rollup/rollup-linux-s390x-gnu@4.24.4': optional: true - '@rollup/rollup-linux-x64-gnu@4.24.2': + '@rollup/rollup-linux-x64-gnu@4.24.4': optional: true - '@rollup/rollup-linux-x64-musl@4.24.2': + '@rollup/rollup-linux-x64-musl@4.24.4': optional: true - '@rollup/rollup-win32-arm64-msvc@4.24.2': + '@rollup/rollup-win32-arm64-msvc@4.24.4': optional: true - '@rollup/rollup-win32-ia32-msvc@4.24.2': + '@rollup/rollup-win32-ia32-msvc@4.24.4': optional: true - '@rollup/rollup-win32-x64-msvc@4.24.2': + '@rollup/rollup-win32-x64-msvc@4.24.4': optional: true '@sec-ant/readable-stream@0.4.1': {} @@ -4266,27 +4266,27 @@ snapshots: '@sigstore/core': 1.1.0 '@sigstore/protobuf-specs': 0.3.2 - '@tsslint/cli@1.0.20(typescript@5.6.3)': + '@tsslint/cli@1.1.3(typescript@5.6.3)': dependencies: '@clack/prompts': 0.7.0 - '@tsslint/config': 1.0.20 - '@tsslint/core': 1.0.20 + '@tsslint/config': 1.1.3 + '@tsslint/core': 1.1.3 glob: 10.4.5 typescript: 5.6.3 - '@tsslint/config@1.0.20': + '@tsslint/config@1.1.3': dependencies: - '@tsslint/types': 1.0.20 + '@tsslint/types': 1.1.3 - '@tsslint/core@1.0.20': + '@tsslint/core@1.1.3': dependencies: - '@tsslint/types': 1.0.20 + '@tsslint/types': 1.1.3 error-stack-parser: 2.1.4 - esbuild: 0.23.1 + esbuild: 0.24.0 minimatch: 10.0.1 source-map-support: 0.5.21 - '@tsslint/types@1.0.20': {} + '@tsslint/types@1.1.3': {} '@tufjs/canonical-json@2.0.0': {} @@ -4299,7 +4299,7 @@ snapshots: '@types/minimatch@5.1.2': {} - '@types/node@22.8.2': + '@types/node@22.9.0': dependencies: undici-types: 6.19.8 @@ -4309,7 +4309,7 @@ snapshots: '@types/semver@7.5.8': {} - '@types/vscode@1.94.0': {} + '@types/vscode@1.95.0': {} '@vitest/expect@2.1.4': dependencies: @@ -4318,13 +4318,13 @@ snapshots: chai: 5.1.2 tinyrainbow: 1.2.0 - '@vitest/mocker@2.1.4(vite@5.4.10(@types/node@22.8.2))': + '@vitest/mocker@2.1.4(vite@5.4.10(@types/node@22.9.0))': dependencies: '@vitest/spy': 2.1.4 estree-walker: 3.0.3 magic-string: 0.30.12 optionalDependencies: - vite: 5.4.10(@types/node@22.8.2) + vite: 5.4.10(@types/node@22.9.0) '@vitest/pretty-format@2.1.4': dependencies: @@ -4487,7 +4487,7 @@ snapshots: '@vue/compiler-core@3.4.38': dependencies: - '@babel/parser': 7.26.1 + '@babel/parser': 7.26.2 '@vue/shared': 3.4.38 entities: 4.5.0 estree-walker: 2.0.2 @@ -4495,7 +4495,7 @@ snapshots: '@vue/compiler-core@3.5.12': dependencies: - '@babel/parser': 7.26.1 + '@babel/parser': 7.26.2 '@vue/shared': 3.5.12 entities: 4.5.0 estree-walker: 2.0.2 @@ -4513,7 +4513,7 @@ snapshots: '@vue/compiler-sfc@2.7.16': dependencies: - '@babel/parser': 7.26.1 + '@babel/parser': 7.26.2 postcss: 8.4.47 source-map: 0.6.1 optionalDependencies: @@ -4521,7 +4521,7 @@ snapshots: '@vue/compiler-sfc@3.4.38': dependencies: - '@babel/parser': 7.26.1 + '@babel/parser': 7.26.2 '@vue/compiler-core': 3.4.38 '@vue/compiler-dom': 3.4.38 '@vue/compiler-ssr': 3.4.38 @@ -4533,7 +4533,7 @@ snapshots: '@vue/compiler-sfc@3.5.12': dependencies: - '@babel/parser': 7.26.1 + '@babel/parser': 7.26.2 '@vue/compiler-core': 3.5.12 '@vue/compiler-dom': 3.5.12 '@vue/compiler-ssr': 3.5.12 @@ -5085,11 +5085,11 @@ snapshots: es-errors@1.3.0: {} - esbuild-plugin-copy@2.1.1(esbuild@0.21.5): + esbuild-plugin-copy@2.1.1(esbuild@0.24.0): dependencies: chalk: 4.1.2 chokidar: 3.6.0 - esbuild: 0.21.5 + esbuild: 0.24.0 fs-extra: 10.1.0 globby: 11.1.0 @@ -5125,32 +5125,32 @@ snapshots: '@esbuild/win32-ia32': 0.21.5 '@esbuild/win32-x64': 0.21.5 - esbuild@0.23.1: + esbuild@0.24.0: optionalDependencies: - '@esbuild/aix-ppc64': 0.23.1 - '@esbuild/android-arm': 0.23.1 - '@esbuild/android-arm64': 0.23.1 - '@esbuild/android-x64': 0.23.1 - '@esbuild/darwin-arm64': 0.23.1 - '@esbuild/darwin-x64': 0.23.1 - '@esbuild/freebsd-arm64': 0.23.1 - '@esbuild/freebsd-x64': 0.23.1 - '@esbuild/linux-arm': 0.23.1 - '@esbuild/linux-arm64': 0.23.1 - '@esbuild/linux-ia32': 0.23.1 - '@esbuild/linux-loong64': 0.23.1 - '@esbuild/linux-mips64el': 0.23.1 - '@esbuild/linux-ppc64': 0.23.1 - '@esbuild/linux-riscv64': 0.23.1 - '@esbuild/linux-s390x': 0.23.1 - '@esbuild/linux-x64': 0.23.1 - '@esbuild/netbsd-x64': 0.23.1 - '@esbuild/openbsd-arm64': 0.23.1 - '@esbuild/openbsd-x64': 0.23.1 - '@esbuild/sunos-x64': 0.23.1 - '@esbuild/win32-arm64': 0.23.1 - '@esbuild/win32-ia32': 0.23.1 - '@esbuild/win32-x64': 0.23.1 + '@esbuild/aix-ppc64': 0.24.0 + '@esbuild/android-arm': 0.24.0 + '@esbuild/android-arm64': 0.24.0 + '@esbuild/android-x64': 0.24.0 + '@esbuild/darwin-arm64': 0.24.0 + '@esbuild/darwin-x64': 0.24.0 + '@esbuild/freebsd-arm64': 0.24.0 + '@esbuild/freebsd-x64': 0.24.0 + '@esbuild/linux-arm': 0.24.0 + '@esbuild/linux-arm64': 0.24.0 + '@esbuild/linux-ia32': 0.24.0 + '@esbuild/linux-loong64': 0.24.0 + '@esbuild/linux-mips64el': 0.24.0 + '@esbuild/linux-ppc64': 0.24.0 + '@esbuild/linux-riscv64': 0.24.0 + '@esbuild/linux-s390x': 0.24.0 + '@esbuild/linux-x64': 0.24.0 + '@esbuild/netbsd-x64': 0.24.0 + '@esbuild/openbsd-arm64': 0.24.0 + '@esbuild/openbsd-x64': 0.24.0 + '@esbuild/sunos-x64': 0.24.0 + '@esbuild/win32-arm64': 0.24.0 + '@esbuild/win32-ia32': 0.24.0 + '@esbuild/win32-x64': 0.24.0 escalade@3.2.0: {} @@ -5666,7 +5666,7 @@ snapshots: lru-cache@10.4.3: {} - lru-cache@11.0.1: {} + lru-cache@11.0.2: {} lru-cache@6.0.0: dependencies: @@ -6004,14 +6004,14 @@ snapshots: parse-json@5.2.0: dependencies: - '@babel/code-frame': 7.26.0 + '@babel/code-frame': 7.26.2 error-ex: 1.3.2 json-parse-even-better-errors: 2.3.1 lines-and-columns: 1.2.4 parse-json@7.1.1: dependencies: - '@babel/code-frame': 7.26.0 + '@babel/code-frame': 7.26.2 error-ex: 1.3.2 json-parse-even-better-errors: 3.0.2 lines-and-columns: 2.0.4 @@ -6019,7 +6019,7 @@ snapshots: parse-json@8.1.0: dependencies: - '@babel/code-frame': 7.26.0 + '@babel/code-frame': 7.26.2 index-to-position: 0.1.2 type-fest: 4.26.1 @@ -6065,7 +6065,7 @@ snapshots: path-scurry@2.0.0: dependencies: - lru-cache: 11.0.1 + lru-cache: 11.0.2 minipass: 7.1.2 path-type@4.0.0: {} @@ -6172,10 +6172,10 @@ snapshots: strip-json-comments: 2.0.1 optional: true - reactive-vscode@0.2.7-beta.1(@types/vscode@1.94.0): + reactive-vscode@0.2.7-beta.1(@types/vscode@1.95.0): dependencies: '@reactive-vscode/reactivity': 0.2.7-beta.1 - '@types/vscode': 1.94.0 + '@types/vscode': 1.95.0 read-cmd-shim@4.0.0: {} @@ -6236,28 +6236,28 @@ snapshots: reusify@1.0.4: {} - rollup@4.24.2: + rollup@4.24.4: dependencies: '@types/estree': 1.0.6 optionalDependencies: - '@rollup/rollup-android-arm-eabi': 4.24.2 - '@rollup/rollup-android-arm64': 4.24.2 - '@rollup/rollup-darwin-arm64': 4.24.2 - '@rollup/rollup-darwin-x64': 4.24.2 - '@rollup/rollup-freebsd-arm64': 4.24.2 - '@rollup/rollup-freebsd-x64': 4.24.2 - '@rollup/rollup-linux-arm-gnueabihf': 4.24.2 - '@rollup/rollup-linux-arm-musleabihf': 4.24.2 - '@rollup/rollup-linux-arm64-gnu': 4.24.2 - '@rollup/rollup-linux-arm64-musl': 4.24.2 - '@rollup/rollup-linux-powerpc64le-gnu': 4.24.2 - '@rollup/rollup-linux-riscv64-gnu': 4.24.2 - '@rollup/rollup-linux-s390x-gnu': 4.24.2 - '@rollup/rollup-linux-x64-gnu': 4.24.2 - '@rollup/rollup-linux-x64-musl': 4.24.2 - '@rollup/rollup-win32-arm64-msvc': 4.24.2 - '@rollup/rollup-win32-ia32-msvc': 4.24.2 - '@rollup/rollup-win32-x64-msvc': 4.24.2 + '@rollup/rollup-android-arm-eabi': 4.24.4 + '@rollup/rollup-android-arm64': 4.24.4 + '@rollup/rollup-darwin-arm64': 4.24.4 + '@rollup/rollup-darwin-x64': 4.24.4 + '@rollup/rollup-freebsd-arm64': 4.24.4 + '@rollup/rollup-freebsd-x64': 4.24.4 + '@rollup/rollup-linux-arm-gnueabihf': 4.24.4 + '@rollup/rollup-linux-arm-musleabihf': 4.24.4 + '@rollup/rollup-linux-arm64-gnu': 4.24.4 + '@rollup/rollup-linux-arm64-musl': 4.24.4 + '@rollup/rollup-linux-powerpc64le-gnu': 4.24.4 + '@rollup/rollup-linux-riscv64-gnu': 4.24.4 + '@rollup/rollup-linux-s390x-gnu': 4.24.4 + '@rollup/rollup-linux-x64-gnu': 4.24.4 + '@rollup/rollup-linux-x64-musl': 4.24.4 + '@rollup/rollup-win32-arm64-msvc': 4.24.4 + '@rollup/rollup-win32-ia32-msvc': 4.24.4 + '@rollup/rollup-win32-x64-msvc': 4.24.4 fsevents: 2.3.3 run-parallel@1.2.0: @@ -6504,7 +6504,7 @@ snapshots: treeverse@3.0.0: {} - tslib@2.8.0: {} + tslib@2.8.1: {} tuf-js@2.2.1: dependencies: @@ -6585,12 +6585,12 @@ snapshots: validate-npm-package-name@5.0.1: {} - vite-node@2.1.4(@types/node@22.8.2): + vite-node@2.1.4(@types/node@22.9.0): dependencies: cac: 6.7.14 debug: 4.3.7 pathe: 1.1.2 - vite: 5.4.10(@types/node@22.8.2) + vite: 5.4.10(@types/node@22.9.0) transitivePeerDependencies: - '@types/node' - less @@ -6602,19 +6602,19 @@ snapshots: - supports-color - terser - vite@5.4.10(@types/node@22.8.2): + vite@5.4.10(@types/node@22.9.0): dependencies: esbuild: 0.21.5 postcss: 8.4.47 - rollup: 4.24.2 + rollup: 4.24.4 optionalDependencies: - '@types/node': 22.8.2 + '@types/node': 22.9.0 fsevents: 2.3.3 - vitest@2.1.4(@types/node@22.8.2): + vitest@2.1.4(@types/node@22.9.0): dependencies: '@vitest/expect': 2.1.4 - '@vitest/mocker': 2.1.4(vite@5.4.10(@types/node@22.8.2)) + '@vitest/mocker': 2.1.4(vite@5.4.10(@types/node@22.9.0)) '@vitest/pretty-format': 2.1.4 '@vitest/runner': 2.1.4 '@vitest/snapshot': 2.1.4 @@ -6630,11 +6630,11 @@ snapshots: tinyexec: 0.3.1 tinypool: 1.0.1 tinyrainbow: 1.2.0 - vite: 5.4.10(@types/node@22.8.2) - vite-node: 2.1.4(@types/node@22.8.2) + vite: 5.4.10(@types/node@22.9.0) + vite-node: 2.1.4(@types/node@22.9.0) why-is-node-running: 2.3.0 optionalDependencies: - '@types/node': 22.8.2 + '@types/node': 22.9.0 transitivePeerDependencies: - less - lightningcss diff --git a/tsslint.config.ts b/tsslint.config.ts index 5639618308..8039b38de6 100644 --- a/tsslint.config.ts +++ b/tsslint.config.ts @@ -1,19 +1,10 @@ import { defineConfig } from '@tsslint/config'; -import { getDefaultRules as getDefaultVolarRules } from 'https://raw.githubusercontent.com/volarjs/volar.js/master/tsslint.config.ts'; +import config from 'https://raw.githubusercontent.com/johnsoncodehk/tsslint-config/refs/heads/master/v1.1.cjs'; export default defineConfig({ - exclude: ['**/*.vue'], - rules: { - ...getDefaultVolarRules(), - }, - plugins: [ - ({ tsconfig }) => ({ - resolveRules(fileName, rules) { - if (tsconfig.endsWith('extensions/vscode/tsconfig.json')) { - delete rules['missing-dependency']; - } - return rules; - }, - }), + exclude: [ + '**/*.vue', + 'extensions/vscode/src/generated-meta.ts', ], + rules: config.rules, }); From 6c8d41d92d4359fff89e946842898e2f8394033b Mon Sep 17 00:00:00 2001 From: Johnson Chu Date: Thu, 7 Nov 2024 02:51:08 +0800 Subject: [PATCH 019/345] chore(vscode): combine build actions --- extensions/vscode/scripts/build.js | 38 ++++-------------------------- 1 file changed, 4 insertions(+), 34 deletions(-) diff --git a/extensions/vscode/scripts/build.js b/extensions/vscode/scripts/build.js index eafe5d17a1..1eb540f5ef 100644 --- a/extensions/vscode/scripts/build.js +++ b/extensions/vscode/scripts/build.js @@ -4,12 +4,13 @@ const fs = require('fs'); require('esbuild').context({ entryPoints: { - client: './out/nodeClientMain.js', - server: './node_modules/@vue/language-server/bin/vue-language-server.js', + 'dist/client': './out/nodeClientMain.js', + 'dist/server': './node_modules/@vue/language-server/bin/vue-language-server.js', + 'node_modules/typescript-vue-plugin-bundle/index': './node_modules/@vue/typescript-plugin/index.js', }, bundle: true, metafile: process.argv.includes('--metafile'), - outdir: './dist', + outdir: '.', external: ['vscode'], format: 'cjs', platform: 'node', @@ -62,34 +63,3 @@ require('esbuild').context({ console.log('finished.'); } }) - -require('esbuild').context({ - entryPoints: ['./node_modules/@vue/typescript-plugin/index.js'], - bundle: true, - outfile: './node_modules/typescript-vue-plugin-bundle/index.js', - external: ['vscode'], - format: 'cjs', - platform: 'node', - tsconfig: './tsconfig.json', - minify: process.argv.includes('--minify'), - plugins: [{ - name: 'umd2esm', - setup(build) { - build.onResolve({ filter: /^(vscode-.*-languageservice|jsonc-parser)/ }, args => { - const pathUmdMay = require.resolve(args.path, { paths: [args.resolveDir] }) - const pathEsm = pathUmdMay.replace('/umd/', '/esm/') - return { path: pathEsm } - }) - }, - }], -}).then(async ctx => { - console.log('building...'); - if (process.argv.includes('--watch')) { - await ctx.watch(); - console.log('watching...'); - } else { - await ctx.rebuild(); - await ctx.dispose(); - console.log('finished.'); - } -}) From 44f309bc0687db8f5910a82ebb5e15fa62209d53 Mon Sep 17 00:00:00 2001 From: Johnson Chu Date: Thu, 7 Nov 2024 03:05:07 +0800 Subject: [PATCH 020/345] chore(vscode): remove esbuild-plugin-copy --- extensions/vscode/package.json | 1 - extensions/vscode/scripts/build.js | 23 ++- pnpm-lock.yaml | 255 ----------------------------- 3 files changed, 14 insertions(+), 265 deletions(-) diff --git a/extensions/vscode/package.json b/extensions/vscode/package.json index 95c5a62c75..1f3af07bbd 100644 --- a/extensions/vscode/package.json +++ b/extensions/vscode/package.json @@ -563,7 +563,6 @@ "@vue/language-server": "2.1.10", "@vue/typescript-plugin": "2.1.10", "esbuild": "latest", - "esbuild-plugin-copy": "latest", "esbuild-visualizer": "latest", "reactive-vscode": "0.2.7-beta.1", "semver": "^7.5.4", diff --git a/extensions/vscode/scripts/build.js b/extensions/vscode/scripts/build.js index 1eb540f5ef..8a1c4bc27e 100644 --- a/extensions/vscode/scripts/build.js +++ b/extensions/vscode/scripts/build.js @@ -29,15 +29,20 @@ require('esbuild').context({ }) }, }, - require('esbuild-plugin-copy').copy({ - resolveFrom: 'cwd', - assets: { - from: ['./node_modules/@vue/language-core/schemas/**/*'], - to: ['./dist/schemas'], + { + name: 'schemas', + setup(build) { + build.onEnd(() => { + if (!fs.existsSync(path.resolve(__dirname, '../dist/schemas'))) { + fs.mkdirSync(path.resolve(__dirname, '../dist/schemas')); + } + fs.cpSync( + path.resolve(__dirname, '../node_modules/@vue/language-core/schemas/vue-tsconfig.schema.json'), + path.resolve(__dirname, '../dist/schemas/vue-tsconfig.schema.json'), + ); + }); }, - // @ts-expect-error - keepStructure: true, - }), + }, { name: 'meta', setup(build) { @@ -62,4 +67,4 @@ require('esbuild').context({ await ctx.dispose(); console.log('finished.'); } -}) +}); diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 6aa43c5ea6..c9912945a1 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -56,9 +56,6 @@ importers: esbuild: specifier: latest version: 0.24.0 - esbuild-plugin-copy: - specifier: latest - version: 2.1.1(esbuild@0.24.0) esbuild-visualizer: specifier: latest version: 0.6.0 @@ -795,18 +792,6 @@ packages: resolution: {integrity: sha512-1Tra2KvyAkJxFOAr8j69nZ7tCq4kswOPVu4C6ZbrcMf6GGQwuBaZH9M9nG5HP3tBShsdEA7+WVfSSgQGnRSclA==} engines: {node: ^18.0.0 || >=20.0.0} - '@nodelib/fs.scandir@2.1.5': - resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==} - engines: {node: '>= 8'} - - '@nodelib/fs.stat@2.0.5': - resolution: {integrity: sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==} - engines: {node: '>= 8'} - - '@nodelib/fs.walk@1.2.8': - resolution: {integrity: sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==} - engines: {node: '>= 8'} - '@npmcli/agent@2.2.2': resolution: {integrity: sha512-OrcNPXdpSl9UX7qPVRWbmWMCSXrcDa2M9DvrbOTj7ao1S4PlqVFYv9/yLKMkrJKZ/V5A/kDBC690or307i26Og==} engines: {node: ^16.14.0 || >=18.0.0} @@ -1317,10 +1302,6 @@ packages: resolution: {integrity: sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==} engines: {node: '>=12'} - anymatch@3.1.3: - resolution: {integrity: sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==} - engines: {node: '>= 8'} - aproba@2.0.0: resolution: {integrity: sha512-lYe4Gx7QT+MKGbDsA+Z+he/Wtef0BiwDOlK/XkBrdfsh9J/jPPXbX0tE9x9cl27Tmu5gg3QUbUrQYa/y+KOHPQ==} @@ -1334,10 +1315,6 @@ packages: array-ify@1.0.0: resolution: {integrity: sha512-c5AMf34bKdvPhQ7tBGhqkgKNUzMr4WUs+WDtC2ZUGOUncbxKMTvqxYctiseW3+L4bA8ec+GcZ6/A/FW4m8ukng==} - array-union@2.1.0: - resolution: {integrity: sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==} - engines: {node: '>=8'} - array-union@3.0.1: resolution: {integrity: sha512-1OvF9IbWwaeiM9VhzYXVQacMibxpXOMYVNIvMtKRyX9SImBXpKcFr8XvFDeEslCyuH/t6KRt7HEO94AlP8Iatw==} engines: {node: '>=12'} @@ -1365,10 +1342,6 @@ packages: resolution: {integrity: sha512-cMtq4W5ZsEwcutJrVId+a/tjt8GSbS+h0oNkdl6+6rBuEv8Ot33Bevj5KPm40t309zuhVic8NjpuL42QCiJWWA==} engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0} - binary-extensions@2.3.0: - resolution: {integrity: sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==} - engines: {node: '>=8'} - bl@4.1.0: resolution: {integrity: sha512-1W07cM9gS6DcLperZfFSj+bWLtaPGSOHWhPiGzXmvVJbRLdG82sH/Kn8EtW1VqWVA54AKf2h5k5BbnIbwF3h6w==} @@ -1381,10 +1354,6 @@ packages: brace-expansion@2.0.1: resolution: {integrity: sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==} - braces@3.0.3: - resolution: {integrity: sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==} - engines: {node: '>=8'} - buffer-crc32@0.2.13: resolution: {integrity: sha512-VO9Ht/+p3SN7SKWqcrgEzjGbRSJYTx+Q1pTQC0wrWqHx0vpJraQ6GtHx8tvcg1rlK1byhU5gccxgOgj7B0TDkQ==} @@ -1425,10 +1394,6 @@ packages: resolution: {integrity: sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==} engines: {node: '>=4'} - chalk@4.1.2: - resolution: {integrity: sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==} - engines: {node: '>=10'} - character-parser@2.2.0: resolution: {integrity: sha512-+UqJQjFEFaTAs3bNsF2j2kEN1baG/zghZbdqoYEDxGZtJo9LBzl1A+m0D4n3qKx8N2FNv8/Xp6yV9mQmBuptaw==} @@ -1443,10 +1408,6 @@ packages: resolution: {integrity: sha512-quS9HgjQpdaXOvsZz82Oz7uxtXiy6UIsIQcpBj7HRw2M63Skasm9qlDocAM7jNuaxdhpPU7c4kJN+gA5MCu4ww==} engines: {node: '>=18.17'} - chokidar@3.6.0: - resolution: {integrity: sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==} - engines: {node: '>= 8.10.0'} - chownr@1.1.4: resolution: {integrity: sha512-jJ0bqzaylmJtVnNgzTeSOs8DPavpbYgEr/b0YL8/2GO3xJEhInFmhKMUnEJQjZumK7KXGFhUy89PrsJWlakBVg==} @@ -1660,10 +1621,6 @@ packages: resolution: {integrity: sha512-bwy0MGW55bG41VqxxypOsdSdGqLwXPI/focwgTYCFMbdUiBAxLg9CFzG08sz2aqzknwiX7Hkl0bQENjg8iLByw==} engines: {node: '>=8'} - dir-glob@3.0.1: - resolution: {integrity: sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==} - engines: {node: '>=8'} - dom-serializer@2.0.0: resolution: {integrity: sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==} @@ -1740,11 +1697,6 @@ packages: resolution: {integrity: sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==} engines: {node: '>= 0.4'} - esbuild-plugin-copy@2.1.1: - resolution: {integrity: sha512-Bk66jpevTcV8KMFzZI1P7MZKZ+uDcrZm2G2egZ2jNIvVnivDpodZI+/KnpL3Jnap0PBdIHU7HwFGB8r+vV5CVw==} - peerDependencies: - esbuild: '>= 0.14.0' - esbuild-visualizer@0.6.0: resolution: {integrity: sha512-oNK3JAhC7+re93VTtUdWJKTDVnA2qXPAjCAoaw9OxEFUXztszw3kcaK46u1U790T8FdUBAWv6F9Xt59P8nJCVA==} engines: {node: '>=18'} @@ -1796,13 +1748,6 @@ packages: exponential-backoff@3.1.1: resolution: {integrity: sha512-dX7e/LHVJ6W3DE1MHWi9S1EYzDESENfLrYohG2G++ovZrYOkm4Knwa0mc1cn84xJOR4KEU0WSchhLbd0UklbHw==} - fast-glob@3.3.2: - resolution: {integrity: sha512-oX2ruAFQwf/Orj8m737Y5adxDQO0LAB7/S5MnxCdTNDd4p6BsyIVsv9JQsATbTSq8KHRpLwIHbVlUNatxd+1Ow==} - engines: {node: '>=8.6.0'} - - fastq@1.17.1: - resolution: {integrity: sha512-sRVD3lWVIXWg6By68ZN7vho9a1pQcN/WBFaAAsDDFzlJjvoGx0P8z7V1t72grFJfJhu3YPZBuu25f7Kaw2jN1w==} - fd-slicer@1.1.0: resolution: {integrity: sha512-cE1qsB/VwyQozZ+q1dGxR8LBYNZeofhEdUNGSMbQD3Gw2lAzX9Zb3uIU6Ebc/Fmyjo9AWWfnn0AUCHqtevs/8g==} @@ -1818,10 +1763,6 @@ packages: resolution: {integrity: sha512-7yAQpD2UMJzLi1Dqv7qFYnPbaPx7ZfFK6PiIxQ4PfkGPyNyl2Ugx+a/umUonmKqjhM4DnfbMvdX6otXq83soQQ==} engines: {node: ^12.20 || >= 14.13} - fill-range@7.1.1: - resolution: {integrity: sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==} - engines: {node: '>=8'} - find-up@4.1.0: resolution: {integrity: sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==} engines: {node: '>=8'} @@ -1845,10 +1786,6 @@ packages: fs-constants@1.0.0: resolution: {integrity: sha512-y6OAwoSIf7FyjMIv94u+b5rdheZEjzR63GTyZJm5qh4Bi+2YgwLCcI/fPFZkL5PSixOt6ZNKm+w+Hfp/Bciwow==} - fs-extra@10.1.0: - resolution: {integrity: sha512-oRXApq54ETRj4eMiFzGnHWGy+zo5raudjuxN0b8H7s/RU2oW0Wvsx9O0ACRN/kRq9E8Vu/ReskGB5o3ji+FzHQ==} - engines: {node: '>=12'} - fs-extra@11.2.0: resolution: {integrity: sha512-PmDi3uwK5nFuXh7XDTlVnS17xJS7vW36is2+w3xcv8SVxiB4NyATf4ctkVY5bkSjX0Y4nbvZCq1/EjtEyr9ktw==} engines: {node: '>=14.14'} @@ -1908,10 +1845,6 @@ packages: github-from-package@0.0.0: resolution: {integrity: sha512-SyHy3T1v2NUXn29OsWdxmK6RwHD+vkj3v8en8AOBZ1wBQ/hCAQ5bAQTD02kW4W9tUp/3Qh6J8r9EvntiyCmOOw==} - glob-parent@5.1.2: - resolution: {integrity: sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==} - engines: {node: '>= 6'} - glob-parent@6.0.2: resolution: {integrity: sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==} engines: {node: '>=10.13.0'} @@ -1925,10 +1858,6 @@ packages: engines: {node: 20 || >=22} hasBin: true - globby@11.1.0: - resolution: {integrity: sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==} - engines: {node: '>=10'} - gopd@1.0.1: resolution: {integrity: sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==} @@ -1944,10 +1873,6 @@ packages: resolution: {integrity: sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==} engines: {node: '>=4'} - has-flag@4.0.0: - resolution: {integrity: sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==} - engines: {node: '>=8'} - has-property-descriptors@1.0.2: resolution: {integrity: sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg==} @@ -2011,10 +1936,6 @@ packages: resolution: {integrity: sha512-VuuG0wCnjhnylG1ABXT3dAuIpTNDs/G8jlpmwXY03fXoXy/8ZK8/T+hMzt8L4WnrLCJgdybqgPagnF/f97cg3A==} engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0} - ignore@5.3.2: - resolution: {integrity: sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==} - engines: {node: '>= 4'} - import-fresh@3.3.0: resolution: {integrity: sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==} engines: {node: '>=6'} @@ -2053,10 +1974,6 @@ packages: is-arrayish@0.2.1: resolution: {integrity: sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==} - is-binary-path@2.1.0: - resolution: {integrity: sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==} - engines: {node: '>=8'} - is-ci@3.0.1: resolution: {integrity: sha512-ZYvCgrefwqoQ6yTyYUbQu64HsITZ3NfKX1lzaEYdkTDcfKzzCI/wthRRYKkdjHKFVgNiXKAKm65Zo1pk2as/QQ==} hasBin: true @@ -2084,10 +2001,6 @@ packages: is-lambda@1.0.1: resolution: {integrity: sha512-z7CMFGNrENq5iFB9Bqo64Xk6Y9sg+epq1myIcdHaGnbMTYOxvzsEtdYqQUylB7LxfkvgrrjP32T6Ywciio9UIQ==} - is-number@7.0.0: - resolution: {integrity: sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==} - engines: {node: '>=0.12.0'} - is-obj@2.0.0: resolution: {integrity: sha512-drqDG3cbczxxEJRoOXcOjtdp1J/lyp1mNn0xaznRs8+muBhgQcrnbspox5X5fOw0HnMnbfDzvnEMEtqDEJEo8w==} engines: {node: '>=8'} @@ -2305,14 +2218,6 @@ packages: merge-stream@2.0.0: resolution: {integrity: sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==} - merge2@1.4.1: - resolution: {integrity: sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==} - engines: {node: '>= 8'} - - micromatch@4.0.8: - resolution: {integrity: sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==} - engines: {node: '>=8.6'} - mime-db@1.52.0: resolution: {integrity: sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==} engines: {node: '>= 0.6'} @@ -2640,10 +2545,6 @@ packages: resolution: {integrity: sha512-ypGJsmGtdXUOeM5u93TyeIEfEhM6s+ljAhrk5vAvSx8uyY/02OvrZnA0YNGUrPXfpJMgI1ODd3nwz8Npx4O4cg==} engines: {node: 20 || >=22} - path-type@4.0.0: - resolution: {integrity: sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==} - engines: {node: '>=8'} - pathe@1.1.2: resolution: {integrity: sha512-whLdWMYL2TwI08hn8/ZqAbrVemu0LNaNNJZX73O6qaIdCTfXutsLhMkjdENX0qhsQ9uIimo4/aQOmXkoon2nDQ==} @@ -2743,9 +2644,6 @@ packages: resolution: {integrity: sha512-+38qI9SOr8tfZ4QmJNplMUxqjbe7LKvvZgWdExBOmd+egZTtjLB67Gu0HRX3u/XOq7UU2Nx6nsjvS16Z9uwfpg==} engines: {node: '>=0.6'} - queue-microtask@1.2.3: - resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==} - rc@1.2.8: resolution: {integrity: sha512-y3bGgqKj3QBdxLbLkomlohkvsA8gdAiUQlSBJnBhfn+BPxg4bc62d8TcBW15wavDfgexCgccckhcZvywyQYPOw==} hasBin: true @@ -2783,10 +2681,6 @@ packages: resolution: {integrity: sha512-9u/sniCrY3D5WdsERHzHE4G2YCXqoG5FTHUiCC4SIbr6XcLZBY05ya9EKjYek9O5xOAwjGq+1JdGBAS7Q9ScoA==} engines: {node: '>= 6'} - readdirp@3.6.0: - resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==} - engines: {node: '>=8.10.0'} - request-light@0.7.0: resolution: {integrity: sha512-lMbBMrDoxgsyO+yB3sDcrDuX85yYt7sS8BfQd11jtbW/z5ZWgLZRcEGLsLoYw7I0WSUGQBs8CC8ScIxkTX1+6Q==} @@ -2810,18 +2704,11 @@ packages: resolution: {integrity: sha512-9LkiTwjUh6rT555DtE9rTX+BKByPfrMzEAtnlEtdEwr3Nkffwiihqe2bWADg+OQRjt9gl6ICdmB/ZFDCGAtSow==} engines: {node: '>= 4'} - reusify@1.0.4: - resolution: {integrity: sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==} - engines: {iojs: '>=1.0.0', node: '>=0.10.0'} - rollup@4.24.4: resolution: {integrity: sha512-vGorVWIsWfX3xbcyAS+I047kFKapHYivmkaT63Smj77XwvLSJos6M1xGqZnBPFQFBRZDOcG1QnYEIxAvTr/HjA==} engines: {node: '>=18.0.0', npm: '>=8.0.0'} hasBin: true - run-parallel@1.2.0: - resolution: {integrity: sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==} - safe-buffer@5.2.1: resolution: {integrity: sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==} @@ -2886,10 +2773,6 @@ packages: sisteransi@1.0.5: resolution: {integrity: sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg==} - slash@3.0.0: - resolution: {integrity: sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==} - engines: {node: '>=8'} - slash@5.1.0: resolution: {integrity: sha512-ZA6oR3T/pEyuqwMgAKT0/hAv8oAXckzbkmR0UkUosQ+Mc4RxGoJkRmwHgHufaenlyAgE1Mxgpdcrf75y6XcnDg==} engines: {node: '>=14.16'} @@ -3001,10 +2884,6 @@ packages: resolution: {integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==} engines: {node: '>=4'} - supports-color@7.2.0: - resolution: {integrity: sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==} - engines: {node: '>=8'} - tar-fs@2.1.1: resolution: {integrity: sha512-V0r2Y9scmbDRLCNex/+hYzvp/zyYjvFbHPNgVTKfQvVrb6guiE/fxP+XblDNR011utopbkex2nM4dHNV6GDsng==} @@ -3053,10 +2932,6 @@ packages: resolution: {integrity: sha512-nZD7m9iCPC5g0pYmcaxogYKggSfLsdxl8of3Q/oIbqCqLLIO9IAF0GWjX1z9NZRHPiXv8Wex4yDCaZsgEw0Y8w==} engines: {node: '>=14.14'} - to-regex-range@5.0.1: - resolution: {integrity: sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==} - engines: {node: '>=8.0'} - token-stream@1.0.0: resolution: {integrity: sha512-VSsyNPPW74RpHwR8Fc21uubwHY7wMDeJLys2IX5zJNih+OnAnaifKHo+1LHT7DAdloQ7apeaaWg8l7qnf/TnEg==} @@ -3968,18 +3843,6 @@ snapshots: - supports-color - typescript - '@nodelib/fs.scandir@2.1.5': - dependencies: - '@nodelib/fs.stat': 2.0.5 - run-parallel: 1.2.0 - - '@nodelib/fs.stat@2.0.5': {} - - '@nodelib/fs.walk@1.2.8': - dependencies: - '@nodelib/fs.scandir': 2.1.5 - fastq: 1.17.1 - '@npmcli/agent@2.2.2': dependencies: agent-base: 7.1.1 @@ -4648,11 +4511,6 @@ snapshots: ansi-styles@6.2.1: {} - anymatch@3.1.3: - dependencies: - normalize-path: 3.0.0 - picomatch: 2.3.1 - aproba@2.0.0: {} argparse@2.0.1: {} @@ -4661,8 +4519,6 @@ snapshots: array-ify@1.0.0: {} - array-union@2.1.0: {} - array-union@3.0.1: {} assertion-error@2.0.1: {} @@ -4688,8 +4544,6 @@ snapshots: read-cmd-shim: 4.0.0 write-file-atomic: 5.0.1 - binary-extensions@2.3.0: {} - bl@4.1.0: dependencies: buffer: 5.7.1 @@ -4708,10 +4562,6 @@ snapshots: dependencies: balanced-match: 1.0.2 - braces@3.0.3: - dependencies: - fill-range: 7.1.1 - buffer-crc32@0.2.13: {} buffer-equal-constant-time@1.0.1: {} @@ -4767,11 +4617,6 @@ snapshots: escape-string-regexp: 1.0.5 supports-color: 5.5.0 - chalk@4.1.2: - dependencies: - ansi-styles: 4.3.0 - supports-color: 7.2.0 - character-parser@2.2.0: dependencies: is-regex: 1.1.4 @@ -4801,18 +4646,6 @@ snapshots: undici: 6.20.1 whatwg-mimetype: 4.0.0 - chokidar@3.6.0: - dependencies: - anymatch: 3.1.3 - braces: 3.0.3 - glob-parent: 5.1.2 - is-binary-path: 2.1.0 - is-glob: 4.0.3 - normalize-path: 3.0.0 - readdirp: 3.6.0 - optionalDependencies: - fsevents: 2.3.3 - chownr@1.1.4: optional: true @@ -5003,10 +4836,6 @@ snapshots: detect-libc@2.0.3: optional: true - dir-glob@3.0.1: - dependencies: - path-type: 4.0.0 - dom-serializer@2.0.0: dependencies: domelementtype: 2.3.0 @@ -5085,14 +4914,6 @@ snapshots: es-errors@1.3.0: {} - esbuild-plugin-copy@2.1.1(esbuild@0.24.0): - dependencies: - chalk: 4.1.2 - chokidar: 3.6.0 - esbuild: 0.24.0 - fs-extra: 10.1.0 - globby: 11.1.0 - esbuild-visualizer@0.6.0: dependencies: open: 8.4.2 @@ -5185,18 +5006,6 @@ snapshots: exponential-backoff@3.1.1: {} - fast-glob@3.3.2: - dependencies: - '@nodelib/fs.stat': 2.0.5 - '@nodelib/fs.walk': 1.2.8 - glob-parent: 5.1.2 - merge2: 1.4.1 - micromatch: 4.0.8 - - fastq@1.17.1: - dependencies: - reusify: 1.0.4 - fd-slicer@1.1.0: dependencies: pend: 1.2.0 @@ -5210,10 +5019,6 @@ snapshots: node-domexception: 1.0.0 web-streams-polyfill: 3.3.3 - fill-range@7.1.1: - dependencies: - to-regex-range: 5.0.1 - find-up@4.1.0: dependencies: locate-path: 5.0.0 @@ -5242,12 +5047,6 @@ snapshots: fs-constants@1.0.0: optional: true - fs-extra@10.1.0: - dependencies: - graceful-fs: 4.2.11 - jsonfile: 6.1.0 - universalify: 2.0.1 - fs-extra@11.2.0: dependencies: graceful-fs: 4.2.11 @@ -5309,10 +5108,6 @@ snapshots: github-from-package@0.0.0: optional: true - glob-parent@5.1.2: - dependencies: - is-glob: 4.0.3 - glob-parent@6.0.2: dependencies: is-glob: 4.0.3 @@ -5335,15 +5130,6 @@ snapshots: package-json-from-dist: 1.0.1 path-scurry: 2.0.0 - globby@11.1.0: - dependencies: - array-union: 2.1.0 - dir-glob: 3.0.1 - fast-glob: 3.3.2 - ignore: 5.3.2 - merge2: 1.4.1 - slash: 3.0.0 - gopd@1.0.1: dependencies: get-intrinsic: 1.2.4 @@ -5361,8 +5147,6 @@ snapshots: has-flag@3.0.0: {} - has-flag@4.0.0: {} - has-property-descriptors@1.0.2: dependencies: es-define-property: 1.0.0 @@ -5427,8 +5211,6 @@ snapshots: dependencies: minimatch: 9.0.5 - ignore@5.3.2: {} - import-fresh@3.3.0: dependencies: parent-module: 1.0.1 @@ -5459,10 +5241,6 @@ snapshots: is-arrayish@0.2.1: {} - is-binary-path@2.1.0: - dependencies: - binary-extensions: 2.3.0 - is-ci@3.0.1: dependencies: ci-info: 3.9.0 @@ -5484,8 +5262,6 @@ snapshots: is-lambda@1.0.1: {} - is-number@7.0.0: {} - is-obj@2.0.0: {} is-plain-obj@4.1.0: {} @@ -5710,13 +5486,6 @@ snapshots: merge-stream@2.0.0: {} - merge2@1.4.1: {} - - micromatch@4.0.8: - dependencies: - braces: 3.0.3 - picomatch: 2.3.1 - mime-db@1.52.0: {} mime-types@2.1.35: @@ -6068,8 +5837,6 @@ snapshots: lru-cache: 11.0.2 minipass: 7.1.2 - path-type@4.0.0: {} - pathe@1.1.2: {} pathval@2.0.0: {} @@ -6162,8 +5929,6 @@ snapshots: dependencies: side-channel: 1.0.6 - queue-microtask@1.2.3: {} - rc@1.2.8: dependencies: deep-extend: 0.6.0 @@ -6216,10 +5981,6 @@ snapshots: util-deprecate: 1.0.2 optional: true - readdirp@3.6.0: - dependencies: - picomatch: 2.3.1 - request-light@0.7.0: {} require-directory@2.1.1: {} @@ -6234,8 +5995,6 @@ snapshots: retry@0.12.0: {} - reusify@1.0.4: {} - rollup@4.24.4: dependencies: '@types/estree': 1.0.6 @@ -6260,10 +6019,6 @@ snapshots: '@rollup/rollup-win32-x64-msvc': 4.24.4 fsevents: 2.3.3 - run-parallel@1.2.0: - dependencies: - queue-microtask: 1.2.3 - safe-buffer@5.2.1: {} safer-buffer@2.1.2: {} @@ -6331,8 +6086,6 @@ snapshots: sisteransi@1.0.5: {} - slash@3.0.0: {} - slash@5.1.0: {} smart-buffer@4.2.0: {} @@ -6443,10 +6196,6 @@ snapshots: dependencies: has-flag: 3.0.0 - supports-color@7.2.0: - dependencies: - has-flag: 4.0.0 - tar-fs@2.1.1: dependencies: chownr: 1.1.4 @@ -6496,10 +6245,6 @@ snapshots: tmp@0.2.3: {} - to-regex-range@5.0.1: - dependencies: - is-number: 7.0.0 - token-stream@1.0.0: {} treeverse@3.0.0: {} From bdab27d1e0e54f4b837dc46a91e570d43983b7ce Mon Sep 17 00:00:00 2001 From: Johnson Chu Date: Thu, 7 Nov 2024 03:21:09 +0800 Subject: [PATCH 021/345] chore(vscode): update .vscodeignore --- extensions/vscode/.vscodeignore | 1 + 1 file changed, 1 insertion(+) diff --git a/extensions/vscode/.vscodeignore b/extensions/vscode/.vscodeignore index 2791123a21..df03891801 100644 --- a/extensions/vscode/.vscodeignore +++ b/extensions/vscode/.vscodeignore @@ -1,6 +1,7 @@ out scripts src +tests tsconfig.* meta.json stats.html From 71ff65a9f76c42f312b2d4f1eb33ebaaf6d551a2 Mon Sep 17 00:00:00 2001 From: Johnson Chu Date: Thu, 7 Nov 2024 03:38:56 +0800 Subject: [PATCH 022/345] chore(vscode): share `@vue/language-core` between build files --- extensions/vscode/package.json | 2 +- extensions/vscode/scripts/build.js | 20 ++++++++++++++++---- extensions/vscode/src/nodeClientMain.ts | 4 ++-- 3 files changed, 19 insertions(+), 7 deletions(-) diff --git a/extensions/vscode/package.json b/extensions/vscode/package.json index 1f3af07bbd..1b47dc5253 100644 --- a/extensions/vscode/package.json +++ b/extensions/vscode/package.json @@ -88,7 +88,7 @@ ], "typescriptServerPlugins": [ { - "name": "typescript-vue-plugin-bundle", + "name": "typescript-vue-plugin-pack", "enableForWorkspaceTypeScriptVersions": true, "configNamespace": "typescript" } diff --git a/extensions/vscode/scripts/build.js b/extensions/vscode/scripts/build.js index 8a1c4bc27e..43fc18e834 100644 --- a/extensions/vscode/scripts/build.js +++ b/extensions/vscode/scripts/build.js @@ -6,7 +6,8 @@ require('esbuild').context({ entryPoints: { 'dist/client': './out/nodeClientMain.js', 'dist/server': './node_modules/@vue/language-server/bin/vue-language-server.js', - 'node_modules/typescript-vue-plugin-bundle/index': './node_modules/@vue/typescript-plugin/index.js', + 'node_modules/vue-language-core-pack/index': './node_modules/@vue/language-core/index.js', + 'node_modules/typescript-vue-plugin-pack/index': './node_modules/@vue/typescript-plugin/index.js', }, bundle: true, metafile: process.argv.includes('--metafile'), @@ -22,13 +23,24 @@ require('esbuild').context({ name: 'umd2esm', setup(build) { build.onResolve({ filter: /^(vscode-.*-languageservice|jsonc-parser)/ }, args => { - const pathUmdMay = require.resolve(args.path, { paths: [args.resolveDir] }) + const pathUmdMay = require.resolve(args.path, { paths: [args.resolveDir] }); // Call twice the replace is to solve the problem of the path in Windows - const pathEsm = pathUmdMay.replace('/umd/', '/esm/').replace('\\umd\\', '\\esm\\') - return { path: pathEsm } + const pathEsm = pathUmdMay.replace('/umd/', '/esm/').replace('\\umd\\', '\\esm\\'); + return { path: pathEsm }; }) }, }, + { + name: 'resolve-share-module', + setup(build) { + build.onResolve({ filter: /^@vue\/language-core$/ }, () => { + return { + path: 'vue-language-core-pack', + external: true, + }; + }); + }, + }, { name: 'schemas', setup(build) { diff --git a/extensions/vscode/src/nodeClientMain.ts b/extensions/vscode/src/nodeClientMain.ts index cf8359722c..ab29d80594 100644 --- a/extensions/vscode/src/nodeClientMain.ts +++ b/extensions/vscode/src/nodeClientMain.ts @@ -150,7 +150,7 @@ try { if (!enabledTypeScriptPlugin.value) { text = text.replace( 'for(const e of n.contributes.typescriptServerPlugins', - s => s + `.filter(p=>p.name!=='typescript-vue-plugin-bundle')` + s => s + `.filter(p=>p.name!=='typescript-vue-plugin-pack')` ); } else if (enabledHybridMode.value) { // patch readPlugins @@ -158,7 +158,7 @@ try { 'languages:Array.isArray(e.languages)', [ 'languages:', - `e.name==='typescript-vue-plugin-bundle'?[${config.server.includeLanguages + `e.name==='typescript-vue-plugin-pack'?[${config.server.includeLanguages .map(lang => `'${lang}'`) .join(',')}]`, ':Array.isArray(e.languages)' From 80f0770cf8aafa09dea38ebfddc7ba47014b9662 Mon Sep 17 00:00:00 2001 From: Johnson Chu Date: Thu, 7 Nov 2024 04:00:07 +0800 Subject: [PATCH 023/345] fix(build): enhance module resolution for vscode-languageserver-types and vscode-uri --- extensions/vscode/scripts/build.js | 15 +++++++++++++-- 1 file changed, 13 insertions(+), 2 deletions(-) diff --git a/extensions/vscode/scripts/build.js b/extensions/vscode/scripts/build.js index 43fc18e834..da29ae66d2 100644 --- a/extensions/vscode/scripts/build.js +++ b/extensions/vscode/scripts/build.js @@ -22,12 +22,23 @@ require('esbuild').context({ { name: 'umd2esm', setup(build) { - build.onResolve({ filter: /^(vscode-.*-languageservice|jsonc-parser)/ }, args => { + build.onResolve({ filter: /^(vscode-.*-languageservice|vscode-languageserver-types|jsonc-parser)$/ }, args => { const pathUmdMay = require.resolve(args.path, { paths: [args.resolveDir] }); // Call twice the replace is to solve the problem of the path in Windows const pathEsm = pathUmdMay.replace('/umd/', '/esm/').replace('\\umd\\', '\\esm\\'); return { path: pathEsm }; - }) + }); + build.onResolve({ filter: /^vscode-uri$/ }, args => { + const pathUmdMay = require.resolve(args.path, { paths: [args.resolveDir] }); + // v3 + let pathEsm = pathUmdMay.replace('/umd/index.js', '/esm/index.mjs').replace('\\umd\\index.js', '\\esm\\index.mjs'); + if (pathEsm !== pathUmdMay && fs.existsSync(pathEsm)) { + return { path: pathEsm }; + } + // v2 + pathEsm = pathUmdMay.replace('/umd/', '/esm/').replace('\\umd\\', '\\esm\\'); + return { path: pathEsm }; + }); }, }, { From 7f27f9aa578aac7e89d2ba49a8b9c632cc9a771c Mon Sep 17 00:00:00 2001 From: Johnson Chu Date: Thu, 7 Nov 2024 04:02:56 +0800 Subject: [PATCH 024/345] chore(vscode): rename typescript-vue-plugin-pack to vue-typescript-plugin-pack in configuration --- extensions/vscode/package.json | 2 +- extensions/vscode/scripts/build.js | 2 +- extensions/vscode/src/nodeClientMain.ts | 4 ++-- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/extensions/vscode/package.json b/extensions/vscode/package.json index 1b47dc5253..e500d44f75 100644 --- a/extensions/vscode/package.json +++ b/extensions/vscode/package.json @@ -88,7 +88,7 @@ ], "typescriptServerPlugins": [ { - "name": "typescript-vue-plugin-pack", + "name": "vue-typescript-plugin-pack", "enableForWorkspaceTypeScriptVersions": true, "configNamespace": "typescript" } diff --git a/extensions/vscode/scripts/build.js b/extensions/vscode/scripts/build.js index da29ae66d2..39acc64a1f 100644 --- a/extensions/vscode/scripts/build.js +++ b/extensions/vscode/scripts/build.js @@ -7,7 +7,7 @@ require('esbuild').context({ 'dist/client': './out/nodeClientMain.js', 'dist/server': './node_modules/@vue/language-server/bin/vue-language-server.js', 'node_modules/vue-language-core-pack/index': './node_modules/@vue/language-core/index.js', - 'node_modules/typescript-vue-plugin-pack/index': './node_modules/@vue/typescript-plugin/index.js', + 'node_modules/vue-typescript-plugin-pack/index': './node_modules/@vue/typescript-plugin/index.js', }, bundle: true, metafile: process.argv.includes('--metafile'), diff --git a/extensions/vscode/src/nodeClientMain.ts b/extensions/vscode/src/nodeClientMain.ts index ab29d80594..56960d104d 100644 --- a/extensions/vscode/src/nodeClientMain.ts +++ b/extensions/vscode/src/nodeClientMain.ts @@ -150,7 +150,7 @@ try { if (!enabledTypeScriptPlugin.value) { text = text.replace( 'for(const e of n.contributes.typescriptServerPlugins', - s => s + `.filter(p=>p.name!=='typescript-vue-plugin-pack')` + s => s + `.filter(p=>p.name!=='vue-typescript-plugin-pack')` ); } else if (enabledHybridMode.value) { // patch readPlugins @@ -158,7 +158,7 @@ try { 'languages:Array.isArray(e.languages)', [ 'languages:', - `e.name==='typescript-vue-plugin-pack'?[${config.server.includeLanguages + `e.name==='vue-typescript-plugin-pack'?[${config.server.includeLanguages .map(lang => `'${lang}'`) .join(',')}]`, ':Array.isArray(e.languages)' From 64354f0f82cd043fdb60eb1c1c945250d546e23f Mon Sep 17 00:00:00 2001 From: Johnson Chu Date: Thu, 7 Nov 2024 04:11:39 +0800 Subject: [PATCH 025/345] fix(language-service): trim whitespace from markdown descriptions --- .../data/language-blocks/cs.json | 22 +++++----- .../data/language-blocks/en.json | 22 +++++----- .../data/language-blocks/fr.json | 22 +++++----- .../data/language-blocks/it.json | 22 +++++----- .../data/language-blocks/ja.json | 22 +++++----- .../data/language-blocks/ko.json | 22 +++++----- .../data/language-blocks/pt.json | 22 +++++----- .../data/language-blocks/ru.json | 22 +++++----- .../data/language-blocks/zh-cn.json | 26 ++++++------ .../data/language-blocks/zh-hk.json | 22 +++++----- .../data/model-modifiers/cs.json | 6 +-- .../data/model-modifiers/en.json | 6 +-- .../data/model-modifiers/fr.json | 6 +-- .../data/model-modifiers/it.json | 6 +-- .../data/model-modifiers/ja.json | 6 +-- .../data/model-modifiers/ko.json | 6 +-- .../data/model-modifiers/pt.json | 6 +-- .../data/model-modifiers/ru.json | 6 +-- .../data/model-modifiers/zh-cn.json | 6 +-- .../data/model-modifiers/zh-hk.json | 6 +-- .../language-service/data/template/cs.json | 40 +++++++++--------- .../language-service/data/template/en.json | 36 ++++++++-------- .../language-service/data/template/fr.json | 42 +++++++++---------- .../language-service/data/template/it.json | 36 ++++++++-------- .../language-service/data/template/ja.json | 38 ++++++++--------- .../language-service/data/template/ko.json | 36 ++++++++-------- .../language-service/data/template/pt.json | 36 ++++++++-------- .../language-service/data/template/ru.json | 36 ++++++++-------- .../language-service/data/template/zh-cn.json | 38 ++++++++--------- .../language-service/data/template/zh-hk.json | 36 ++++++++-------- .../scripts/update-html-data.js | 14 +++---- 31 files changed, 336 insertions(+), 336 deletions(-) diff --git a/packages/language-service/data/language-blocks/cs.json b/packages/language-service/data/language-blocks/cs.json index 5d7c7d9184..a3c42e1dba 100644 --- a/packages/language-service/data/language-blocks/cs.json +++ b/packages/language-service/data/language-blocks/cs.json @@ -8,7 +8,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nPokud dáváte přednost rozdělení vašich `*.vue` komponent do více souborů, můžete použít atribut `src` pro import externího souboru do příslušného bloku jazyka:\n\n```vue\n\n\n\n```\n\nPozor na to, že pro importy pomocí `src` platí stejná pravidla pro zadávání cest jako pro požadavky na webpack moduly, což znamená:\n\n- Relativní cesty musí začínat s `./`\n- Můžete importovat zdroje z npm závislostí:\n\n```vue\n\n\n\n```\n\nPozor na to, že pro importy pomocí `src` platí stejná pravidla pro zadávání cest jako pro požadavky na webpack moduly, což znamená:\n\n- Relativní cesty musí začínat s `./`\n- Můžete importovat zdroje z npm závislostí:\n\n```vue\n\n\n```\n\nDejte pozor, že integrace s různými pre-procesory se může lišit podle zvolené sady softwarových nástrojů. Pro příklady se podívejte do příslušné dokumentace:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "Bloky mohou pomocí atributu `lang` deklarovat programovací jazyk, v němž má proběhnout pre-processing. Nejběžnější případ je použití TypeScriptu pro blok `\n```\n\n`lang` lze použít na jakýkoli blok - například můžeme použít `\n```\n\nDejte pozor, že integrace s různými pre-procesory se může lišit podle zvolené sady softwarových nástrojů. Pro příklady se podívejte do příslušné dokumentace:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [ { @@ -201,7 +201,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nPokud dáváte přednost rozdělení vašich `*.vue` komponent do více souborů, můžete použít atribut `src` pro import externího souboru do příslušného bloku jazyka:\n\n```vue\n\n\n\n```\n\nPozor na to, že pro importy pomocí `src` platí stejná pravidla pro zadávání cest jako pro požadavky na webpack moduly, což znamená:\n\n- Relativní cesty musí začínat s `./`\n- Můžete importovat zdroje z npm závislostí:\n\n```vue\n\n\n\n```\n\nPozor na to, že pro importy pomocí `src` platí stejná pravidla pro zadávání cest jako pro požadavky na webpack moduly, což znamená:\n\n- Relativní cesty musí začínat s `./`\n- Můžete importovat zdroje z npm závislostí:\n\n```vue\n\n\n```\n\nDejte pozor, že integrace s různými pre-procesory se může lišit podle zvolené sady softwarových nástrojů. Pro příklady se podívejte do příslušné dokumentace:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "Bloky mohou pomocí atributu `lang` deklarovat programovací jazyk, v němž má proběhnout pre-processing. Nejběžnější případ je použití TypeScriptu pro blok `\n```\n\n`lang` lze použít na jakýkoli blok - například můžeme použít `\n```\n\nDejte pozor, že integrace s různými pre-procesory se může lišit podle zvolené sady softwarových nástrojů. Pro příklady se podívejte do příslušné dokumentace:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [ { @@ -527,7 +527,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nPokud dáváte přednost rozdělení vašich `*.vue` komponent do více souborů, můžete použít atribut `src` pro import externího souboru do příslušného bloku jazyka:\n\n```vue\n\n\n\n```\n\nPozor na to, že pro importy pomocí `src` platí stejná pravidla pro zadávání cest jako pro požadavky na webpack moduly, což znamená:\n\n- Relativní cesty musí začínat s `./`\n- Můžete importovat zdroje z npm závislostí:\n\n```vue\n\n\n\n```\n\nPozor na to, že pro importy pomocí `src` platí stejná pravidla pro zadávání cest jako pro požadavky na webpack moduly, což znamená:\n\n- Relativní cesty musí začínat s `./`\n- Můžete importovat zdroje z npm závislostí:\n\n```vue\n\n\n```\n\nDejte pozor, že integrace s různými pre-procesory se může lišit podle zvolené sady softwarových nástrojů. Pro příklady se podívejte do příslušné dokumentace:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "Bloky mohou pomocí atributu `lang` deklarovat programovací jazyk, v němž má proběhnout pre-processing. Nejběžnější případ je použití TypeScriptu pro blok `\n```\n\n`lang` lze použít na jakýkoli blok - například můžeme použít `\n```\n\nDejte pozor, že integrace s různými pre-procesory se může lišit podle zvolené sady softwarových nástrojů. Pro příklady se podívejte do příslušné dokumentace:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [ { @@ -670,7 +670,7 @@ "valueSet": "v", "description": { "kind": "markdown", - "value": "\nKdyž má sekce `\n\n\n```\n\nNa toto:\n\n```vue\n\n\n\n```\n\n### Root elementy komponent potomka\n\nSe `scoped` atributem nebudou styly komponenty rodiče prosakovat do komponent potomků. Nicméně root element komponenty potomka bude ovlivněn jak rodičovským `scoped` CSS, tak vlastním `scoped` CSS. Toto je záměr, aby rodič mohl stylovat root element svého potomka pro účely rozvržení (layout).\n\n### Deep selektory \n\nPokud chcete, aby selektor ve `scoped` stylech byl „hluboký“ a ovlivňoval i komponenty potomků, můžete použít pseudotřídu `:deep()`:\n\n```vue\n\n```\n\nVýše uvedený kód se zkompiluje na:\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip\nObsah DOM vytvořený pomocí `v-html` není ovlivněn `scoped` styly, ale pomocí deep selektorů jej stále lze stylovat.\n:::\n\n### Selektory pro sloty \n\nVe výchozím nastavení `scoped` styly neovlivňují obsah vykreslený pomocí ``, protože ty jsou považovány za vlastnictví komponenty rodiče, která je předává. Pro explicitní cílení na obsah slotu použijte pseudotřídu `:slotted`:\n\n```vue\n\n```\n\n### Globální selektory \n\nPokud chcete, aby se pravidlo aplikovalo globálně, můžete místo vytváření dalšího `\n```\n\n### Kombinace lokálních a globálních stylů \n\nMůžete také do stejné komponenty zahrnout jak lokální, tak globální styly:\n\n```vue\n\n\n\n```\n\n### Tipy pro lokální styly \n\n- **Lokální styly neodstraňují potřebu tříd**. Kvůli způsobu, jakým prohlížeče vyhodnocují různé CSS selektory, bude `p { color: red }` mnohem pomalejší, když je použit s atributovým selektorem. Pokud místo toho použijete třídy nebo id, například `.example { color: red }`, prakticky tím tento problém výkonosti eliminujete.\n\n- **Buďte opatrní s selektory potomků v rekurzivních komponentách!** Pro CSS pravidlo se selektorem `.a .b`, pokud prvek odpovídající `.a` obsahuje rekurzivní komponentu potomka, pak všechny `.b` v této komponentě potomka budou pravidlu odpovídat.\n" + "value": "Když má sekce `\n\n\n```\n\nNa toto:\n\n```vue\n\n\n\n```\n\n### Root elementy komponent potomka\n\nSe `scoped` atributem nebudou styly komponenty rodiče prosakovat do komponent potomků. Nicméně root element komponenty potomka bude ovlivněn jak rodičovským `scoped` CSS, tak vlastním `scoped` CSS. Toto je záměr, aby rodič mohl stylovat root element svého potomka pro účely rozvržení (layout).\n\n### Deep selektory \n\nPokud chcete, aby selektor ve `scoped` stylech byl „hluboký“ a ovlivňoval i komponenty potomků, můžete použít pseudotřídu `:deep()`:\n\n```vue\n\n```\n\nVýše uvedený kód se zkompiluje na:\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip\nObsah DOM vytvořený pomocí `v-html` není ovlivněn `scoped` styly, ale pomocí deep selektorů jej stále lze stylovat.\n:::\n\n### Selektory pro sloty \n\nVe výchozím nastavení `scoped` styly neovlivňují obsah vykreslený pomocí ``, protože ty jsou považovány za vlastnictví komponenty rodiče, která je předává. Pro explicitní cílení na obsah slotu použijte pseudotřídu `:slotted`:\n\n```vue\n\n```\n\n### Globální selektory \n\nPokud chcete, aby se pravidlo aplikovalo globálně, můžete místo vytváření dalšího `\n```\n\n### Kombinace lokálních a globálních stylů \n\nMůžete také do stejné komponenty zahrnout jak lokální, tak globální styly:\n\n```vue\n\n\n\n```\n\n### Tipy pro lokální styly \n\n- **Lokální styly neodstraňují potřebu tříd**. Kvůli způsobu, jakým prohlížeče vyhodnocují různé CSS selektory, bude `p { color: red }` mnohem pomalejší, když je použit s atributovým selektorem. Pokud místo toho použijete třídy nebo id, například `.example { color: red }`, prakticky tím tento problém výkonosti eliminujete.\n\n- **Buďte opatrní s selektory potomků v rekurzivních komponentách!** Pro CSS pravidlo se selektorem `.a .b`, pokud prvek odpovídající `.a` obsahuje rekurzivní komponentu potomka, pak všechny `.b` v této komponentě potomka budou pravidlu odpovídat." }, "references": [ { @@ -732,7 +732,7 @@ "valueSet": "v", "description": { "kind": "markdown", - "value": "\nTag `\n```\n\nVýsledné třídy jsou hashovány, aby se předešlo kolizím, čímž se dosáhne stejného efektu omezování platnosti CSS pouze na aktuální komponentu.\n\nPro více podrobností, jako jsou [globální výjimky](https://github.com/css-modules/css-modules/blob/master/docs/composition.md#exceptions) a [kompozice](https://github.com/css-modules/css-modules/blob/master/docs/composition.md#composition), se podívejte na [specifikaci CSS modulů](https://github.com/css-modules/css-modules).\n\n### Vlastní název implementovaných tříd \n\nMůžete přizpůsobit klíč vlastnosti implementovaného objektu tříd tím, že atributu `module` přiřadíte hodnotu:\n\n```vue\n\n\n\n```\n\n### Použití s Composition API \n\nNa implementované třídy lze přistupovat v `setup()` a `\n\n\n\n\n```" }, "references": [ { @@ -856,7 +856,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nPokud dáváte přednost rozdělení vašich `*.vue` komponent do více souborů, můžete použít atribut `src` pro import externího souboru do příslušného bloku jazyka:\n\n```vue\n\n\n\n```\n\nPozor na to, že pro importy pomocí `src` platí stejná pravidla pro zadávání cest jako pro požadavky na webpack moduly, což znamená:\n\n- Relativní cesty musí začínat s `./`\n- Můžete importovat zdroje z npm závislostí:\n\n```vue\n\n\n\n```\n\nPozor na to, že pro importy pomocí `src` platí stejná pravidla pro zadávání cest jako pro požadavky na webpack moduly, což znamená:\n\n- Relativní cesty musí začínat s `./`\n- Můžete importovat zdroje z npm závislostí:\n\n```vue\n\n\n```\n\nDejte pozor, že integrace s různými pre-procesory se může lišit podle zvolené sady softwarových nástrojů. Pro příklady se podívejte do příslušné dokumentace:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "Bloky mohou pomocí atributu `lang` deklarovat programovací jazyk, v němž má proběhnout pre-processing. Nejběžnější případ je použití TypeScriptu pro blok `\n```\n\n`lang` lze použít na jakýkoli blok - například můžeme použít `\n```\n\nDejte pozor, že integrace s různými pre-procesory se může lišit podle zvolené sady softwarových nástrojů. Pro příklady se podívejte do příslušné dokumentace:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [], "references": [ @@ -1041,7 +1041,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nPokud dáváte přednost rozdělení vašich `*.vue` komponent do více souborů, můžete použít atribut `src` pro import externího souboru do příslušného bloku jazyka:\n\n```vue\n\n\n\n```\n\nPozor na to, že pro importy pomocí `src` platí stejná pravidla pro zadávání cest jako pro požadavky na webpack moduly, což znamená:\n\n- Relativní cesty musí začínat s `./`\n- Můžete importovat zdroje z npm závislostí:\n\n```vue\n\n\n\n```\n\nPozor na to, že pro importy pomocí `src` platí stejná pravidla pro zadávání cest jako pro požadavky na webpack moduly, což znamená:\n\n- Relativní cesty musí začínat s `./`\n- Můžete importovat zdroje z npm závislostí:\n\n```vue\n\n\n\n```\n\nBeware that `src` imports follow the same path resolution rules as webpack module requests, which means:\n\n- Relative paths need to start with `./`\n- You can import resources from npm dependencies:\n\n```vue\n\n\n\n```\n\nBeware that `src` imports follow the same path resolution rules as webpack module requests, which means:\n\n- Relative paths need to start with `./`\n- You can import resources from npm dependencies:\n\n```vue\n\n\n```\n\nNote that integration with various pre-processors may differ by toolchain. Check out the respective documentation for examples:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "Blocks can declare pre-processor languages using the `lang` attribute. The most common case is using TypeScript for the `\n```\n\n`lang` can be applied to any block - for example we can use `\n```\n\nNote that integration with various pre-processors may differ by toolchain. Check out the respective documentation for examples:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [ { @@ -201,7 +201,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nIf you prefer splitting up your `*.vue` components into multiple files, you can use the `src` attribute to import an external file for a language block:\n\n```vue\n\n\n\n```\n\nBeware that `src` imports follow the same path resolution rules as webpack module requests, which means:\n\n- Relative paths need to start with `./`\n- You can import resources from npm dependencies:\n\n```vue\n\n\n\n```\n\nBeware that `src` imports follow the same path resolution rules as webpack module requests, which means:\n\n- Relative paths need to start with `./`\n- You can import resources from npm dependencies:\n\n```vue\n\n\n```\n\nNote that integration with various pre-processors may differ by toolchain. Check out the respective documentation for examples:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "Blocks can declare pre-processor languages using the `lang` attribute. The most common case is using TypeScript for the `\n```\n\n`lang` can be applied to any block - for example we can use `\n```\n\nNote that integration with various pre-processors may differ by toolchain. Check out the respective documentation for examples:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [ { @@ -527,7 +527,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nIf you prefer splitting up your `*.vue` components into multiple files, you can use the `src` attribute to import an external file for a language block:\n\n```vue\n\n\n\n```\n\nBeware that `src` imports follow the same path resolution rules as webpack module requests, which means:\n\n- Relative paths need to start with `./`\n- You can import resources from npm dependencies:\n\n```vue\n\n\n\n```\n\nBeware that `src` imports follow the same path resolution rules as webpack module requests, which means:\n\n- Relative paths need to start with `./`\n- You can import resources from npm dependencies:\n\n```vue\n\n\n```\n\nNote that integration with various pre-processors may differ by toolchain. Check out the respective documentation for examples:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "Blocks can declare pre-processor languages using the `lang` attribute. The most common case is using TypeScript for the `\n```\n\n`lang` can be applied to any block - for example we can use `\n```\n\nNote that integration with various pre-processors may differ by toolchain. Check out the respective documentation for examples:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [ { @@ -670,7 +670,7 @@ "valueSet": "v", "description": { "kind": "markdown", - "value": "\nWhen a `\n\n\n```\n\nInto the following:\n\n```vue\n\n\n\n```\n\n### Child Component Root Elements \n\nWith `scoped`, the parent component's styles will not leak into child components. However, a child component's root node will be affected by both the parent's scoped CSS and the child's scoped CSS. This is by design so that the parent can style the child root element for layout purposes.\n\n### Deep Selectors \n\nIf you want a selector in `scoped` styles to be \"deep\", i.e. affecting child components, you can use the `:deep()` pseudo-class:\n\n```vue\n\n```\n\nThe above will be compiled into:\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip\nDOM content created with `v-html` are not affected by scoped styles, but you can still style them using deep selectors.\n:::\n\n### Slotted Selectors \n\nBy default, scoped styles do not affect contents rendered by ``, as they are considered to be owned by the parent component passing them in. To explicitly target slot content, use the `:slotted` pseudo-class:\n\n```vue\n\n```\n\n### Global Selectors \n\nIf you want just one rule to apply globally, you can use the `:global` pseudo-class rather than creating another `\n```\n\n### Mixing Local and Global Styles \n\nYou can also include both scoped and non-scoped styles in the same component:\n\n```vue\n\n\n\n```\n\n### Scoped Style Tips \n\n- **Scoped styles do not eliminate the need for classes**. Due to the way browsers render various CSS selectors, `p { color: red }` will be many times slower when scoped (i.e. when combined with an attribute selector). If you use classes or ids instead, such as in `.example { color: red }`, then you virtually eliminate that performance hit.\n\n- **Be careful with descendant selectors in recursive components!** For a CSS rule with the selector `.a .b`, if the element that matches `.a` contains a recursive child component, then all `.b` in that child component will be matched by the rule.\n" + "value": "When a `\n\n\n```\n\nInto the following:\n\n```vue\n\n\n\n```\n\n### Child Component Root Elements \n\nWith `scoped`, the parent component's styles will not leak into child components. However, a child component's root node will be affected by both the parent's scoped CSS and the child's scoped CSS. This is by design so that the parent can style the child root element for layout purposes.\n\n### Deep Selectors \n\nIf you want a selector in `scoped` styles to be \"deep\", i.e. affecting child components, you can use the `:deep()` pseudo-class:\n\n```vue\n\n```\n\nThe above will be compiled into:\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip\nDOM content created with `v-html` are not affected by scoped styles, but you can still style them using deep selectors.\n:::\n\n### Slotted Selectors \n\nBy default, scoped styles do not affect contents rendered by ``, as they are considered to be owned by the parent component passing them in. To explicitly target slot content, use the `:slotted` pseudo-class:\n\n```vue\n\n```\n\n### Global Selectors \n\nIf you want just one rule to apply globally, you can use the `:global` pseudo-class rather than creating another `\n```\n\n### Mixing Local and Global Styles \n\nYou can also include both scoped and non-scoped styles in the same component:\n\n```vue\n\n\n\n```\n\n### Scoped Style Tips \n\n- **Scoped styles do not eliminate the need for classes**. Due to the way browsers render various CSS selectors, `p { color: red }` will be many times slower when scoped (i.e. when combined with an attribute selector). If you use classes or ids instead, such as in `.example { color: red }`, then you virtually eliminate that performance hit.\n\n- **Be careful with descendant selectors in recursive components!** For a CSS rule with the selector `.a .b`, if the element that matches `.a` contains a recursive child component, then all `.b` in that child component will be matched by the rule." }, "references": [ { @@ -732,7 +732,7 @@ "valueSet": "v", "description": { "kind": "markdown", - "value": "\nA `\n```\n\nThe resulting classes are hashed to avoid collision, achieving the same effect of scoping the CSS to the current component only.\n\nRefer to the [CSS Modules spec](https://github.com/css-modules/css-modules) for more details such as [global exceptions](https://github.com/css-modules/css-modules/blob/master/docs/composition.md#exceptions) and [composition](https://github.com/css-modules/css-modules/blob/master/docs/composition.md#composition).\n\n### Custom Inject Name \n\nYou can customize the property key of the injected classes object by giving the `module` attribute a value:\n\n```vue\n\n\n\n```\n\n### Usage with Composition API \n\nThe injected classes can be accessed in `setup()` and `\n\n\n\n\n```" }, "references": [ { @@ -856,7 +856,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nIf you prefer splitting up your `*.vue` components into multiple files, you can use the `src` attribute to import an external file for a language block:\n\n```vue\n\n\n\n```\n\nBeware that `src` imports follow the same path resolution rules as webpack module requests, which means:\n\n- Relative paths need to start with `./`\n- You can import resources from npm dependencies:\n\n```vue\n\n\n\n```\n\nBeware that `src` imports follow the same path resolution rules as webpack module requests, which means:\n\n- Relative paths need to start with `./`\n- You can import resources from npm dependencies:\n\n```vue\n\n\n```\n\nNote that integration with various pre-processors may differ by toolchain. Check out the respective documentation for examples:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "Blocks can declare pre-processor languages using the `lang` attribute. The most common case is using TypeScript for the `\n```\n\n`lang` can be applied to any block - for example we can use `\n```\n\nNote that integration with various pre-processors may differ by toolchain. Check out the respective documentation for examples:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [], "references": [ @@ -1041,7 +1041,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nIf you prefer splitting up your `*.vue` components into multiple files, you can use the `src` attribute to import an external file for a language block:\n\n```vue\n\n\n\n```\n\nBeware that `src` imports follow the same path resolution rules as webpack module requests, which means:\n\n- Relative paths need to start with `./`\n- You can import resources from npm dependencies:\n\n```vue\n\n\n\n```\n\nBeware that `src` imports follow the same path resolution rules as webpack module requests, which means:\n\n- Relative paths need to start with `./`\n- You can import resources from npm dependencies:\n\n```vue\n\n\n\n```\n\nAttention, les importations `src` suivent les mêmes règles de résolution de chemin que les requêtes de modules de webpack, ce qui signifie que :\n\n- Les chemins relatifs doivent commencer par `./`.\n- Vous pouvez importer des ressources à partir des dépendances npm :\n\n```vue\n\n\n\n```\n\nAttention, les importations `src` suivent les mêmes règles de résolution de chemin que les requêtes de modules de webpack, ce qui signifie que :\n\n- Les chemins relatifs doivent commencer par `./`.\n- Vous pouvez importer des ressources à partir des dépendances npm :\n\n```vue\n\n\n```\n\nNotez que l'intégration avec divers pré-processeurs peut différer selon les outils utilisés. Consultez la documentation correspondante pour des exemples :\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "Les blocs peuvent déclarer des langages de pré-processeur en utilisant l'attribut `lang`. Le cas le plus courant est l'utilisation de TypeScript pour le bloc `\n```\n\n`lang` peut être appliqué à n'importe quel bloc - par exemple, nous pouvons utiliser `\n```\n\nNotez que l'intégration avec divers pré-processeurs peut différer selon les outils utilisés. Consultez la documentation correspondante pour des exemples :\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [ { @@ -201,7 +201,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nSi vous préférez séparer vos composants `*.vue` en plusieurs fichiers, vous pouvez utiliser l'attribut `src` pour importer un fichier externe pour un bloc de langage :\n\n```vue\n\n\n\n```\n\nAttention, les importations `src` suivent les mêmes règles de résolution de chemin que les requêtes de modules de webpack, ce qui signifie que :\n\n- Les chemins relatifs doivent commencer par `./`.\n- Vous pouvez importer des ressources à partir des dépendances npm :\n\n```vue\n\n\n\n```\n\nAttention, les importations `src` suivent les mêmes règles de résolution de chemin que les requêtes de modules de webpack, ce qui signifie que :\n\n- Les chemins relatifs doivent commencer par `./`.\n- Vous pouvez importer des ressources à partir des dépendances npm :\n\n```vue\n\n\n```\n\nNotez que l'intégration avec divers pré-processeurs peut différer selon les outils utilisés. Consultez la documentation correspondante pour des exemples :\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "Les blocs peuvent déclarer des langages de pré-processeur en utilisant l'attribut `lang`. Le cas le plus courant est l'utilisation de TypeScript pour le bloc `\n```\n\n`lang` peut être appliqué à n'importe quel bloc - par exemple, nous pouvons utiliser `\n```\n\nNotez que l'intégration avec divers pré-processeurs peut différer selon les outils utilisés. Consultez la documentation correspondante pour des exemples :\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [ { @@ -527,7 +527,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nSi vous préférez séparer vos composants `*.vue` en plusieurs fichiers, vous pouvez utiliser l'attribut `src` pour importer un fichier externe pour un bloc de langage :\n\n```vue\n\n\n\n```\n\nAttention, les importations `src` suivent les mêmes règles de résolution de chemin que les requêtes de modules de webpack, ce qui signifie que :\n\n- Les chemins relatifs doivent commencer par `./`.\n- Vous pouvez importer des ressources à partir des dépendances npm :\n\n```vue\n\n\n\n```\n\nAttention, les importations `src` suivent les mêmes règles de résolution de chemin que les requêtes de modules de webpack, ce qui signifie que :\n\n- Les chemins relatifs doivent commencer par `./`.\n- Vous pouvez importer des ressources à partir des dépendances npm :\n\n```vue\n\n\n```\n\nNotez que l'intégration avec divers pré-processeurs peut différer selon les outils utilisés. Consultez la documentation correspondante pour des exemples :\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "Les blocs peuvent déclarer des langages de pré-processeur en utilisant l'attribut `lang`. Le cas le plus courant est l'utilisation de TypeScript pour le bloc `\n```\n\n`lang` peut être appliqué à n'importe quel bloc - par exemple, nous pouvons utiliser `\n```\n\nNotez que l'intégration avec divers pré-processeurs peut différer selon les outils utilisés. Consultez la documentation correspondante pour des exemples :\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [ { @@ -670,7 +670,7 @@ "valueSet": "v", "description": { "kind": "markdown", - "value": "\nLorsqu'une balise `\n\n\n```\n\nEn ce qui suit :\n\n```vue\n\n\n\n```\n\n### Éléments racines du composant enfant \n\nAvec `scoped`, les styles du composant parent ne ruisselleront pas dans les composants enfants. Toutefois, le nœud racine d'un composant enfant sera affecté à la fois par le CSS à portée limitée du parent et par le CSS à portée limitée de l'enfant. Cela a été conçu afin que le parent puisse donner un style à l'élément racine de l'enfant à des fins de mise en page.\n\n### Sélecteurs profonds \n\nSi vous voulez qu'un sélecteur dans les styles `scoped` soit \"profond\", c'est-à-dire qu'il affecte les composants enfants, vous pouvez utiliser la pseudo-classe `:deep()` :\n\n```vue\n\n```\n\nLe code ci-dessus sera compilé en :\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip\nLes contenus du DOM créés avec `v-html` ne sont pas affectés par les styles à portée limitée, mais vous pouvez tout de même les styliser en utilisant des sélecteurs profonds.\n:::\n\n### Sélecteurs de slots \n\nPar défaut, les styles à portée limitée n'affectent pas les contenus rendus par ``, car ils sont considérés comme appartenant au composant parent qui les transmet. Pour cibler explicitement le contenu des slots, utilisez la pseudo-classe `:slotted` :\n\n```vue\n\n```\n\n### Sélecteurs globaux \n\nSi vous voulez qu'une seule règle s'applique de manière globale, vous pouvez utiliser la pseudo-classe `:global` plutôt que de créer un autre `\n```\n\n### Mélanger les styles locaux et globaux \n\nVous pouvez également inclure des styles généraux et d'autres à portée limitée dans le même composant :\n\n```vue\n\n\n\n```\n\n### Conseils concernant les styles à portée limitée \n\n- **Les styles à portée limitée ne rendent pas les classes inutiles**. En raison de la façon dont les navigateurs rendent les différents sélecteurs CSS, `p { color : red }` sera bien plus lent lorsqu'il a une portée limitée (c'est-à-dire lorsqu'il est combiné avec un sélecteur d'attribut). Si vous utilisez des classes ou des identifiants à la place, comme dans `.example { color : red }`, vous éliminez en grande partie ce problème de performances.\n\n- **Faites attention aux sélecteurs descendants dans les composants récursifs!** Pour une règle CSS avec le sélecteur `.a .b`, si l'élément qui correspond à `.a` contient un composant enfant récursif, alors tous les `.b` de ce composant enfant seront pris en compte par la règle.\n" + "value": "Lorsqu'une balise `\n\n\n```\n\nEn ce qui suit :\n\n```vue\n\n\n\n```\n\n### Éléments racines du composant enfant \n\nAvec `scoped`, les styles du composant parent ne ruisselleront pas dans les composants enfants. Toutefois, le nœud racine d'un composant enfant sera affecté à la fois par le CSS à portée limitée du parent et par le CSS à portée limitée de l'enfant. Cela a été conçu afin que le parent puisse donner un style à l'élément racine de l'enfant à des fins de mise en page.\n\n### Sélecteurs profonds \n\nSi vous voulez qu'un sélecteur dans les styles `scoped` soit \"profond\", c'est-à-dire qu'il affecte les composants enfants, vous pouvez utiliser la pseudo-classe `:deep()` :\n\n```vue\n\n```\n\nLe code ci-dessus sera compilé en :\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip\nLes contenus du DOM créés avec `v-html` ne sont pas affectés par les styles à portée limitée, mais vous pouvez tout de même les styliser en utilisant des sélecteurs profonds.\n:::\n\n### Sélecteurs de slots \n\nPar défaut, les styles à portée limitée n'affectent pas les contenus rendus par ``, car ils sont considérés comme appartenant au composant parent qui les transmet. Pour cibler explicitement le contenu des slots, utilisez la pseudo-classe `:slotted` :\n\n```vue\n\n```\n\n### Sélecteurs globaux \n\nSi vous voulez qu'une seule règle s'applique de manière globale, vous pouvez utiliser la pseudo-classe `:global` plutôt que de créer un autre `\n```\n\n### Mélanger les styles locaux et globaux \n\nVous pouvez également inclure des styles généraux et d'autres à portée limitée dans le même composant :\n\n```vue\n\n\n\n```\n\n### Conseils concernant les styles à portée limitée \n\n- **Les styles à portée limitée ne rendent pas les classes inutiles**. En raison de la façon dont les navigateurs rendent les différents sélecteurs CSS, `p { color : red }` sera bien plus lent lorsqu'il a une portée limitée (c'est-à-dire lorsqu'il est combiné avec un sélecteur d'attribut). Si vous utilisez des classes ou des identifiants à la place, comme dans `.example { color : red }`, vous éliminez en grande partie ce problème de performances.\n\n- **Faites attention aux sélecteurs descendants dans les composants récursifs!** Pour une règle CSS avec le sélecteur `.a .b`, si l'élément qui correspond à `.a` contient un composant enfant récursif, alors tous les `.b` de ce composant enfant seront pris en compte par la règle." }, "references": [ { @@ -732,7 +732,7 @@ "valueSet": "v", "description": { "kind": "markdown", - "value": "\nUne balise `\n```\n\nLes classes qui en résultent sont hachées pour éviter les collisions, ce qui permet d'obtenir le même effet que de limiter la portée du CSS au seul composant actuel.\n\nConsultez la [spécification des modules CSS](https://github.com/css-modules/css-modules) pour plus de détails, notamment les parties sur les [exceptions globales](https://github.com/css-modules/css-modules/blob/master/docs/composition.md#exceptions) et la [composition](https://github.com/css-modules/css-modules/blob/master/docs/composition.md#composition).\n\n### Nom d'injection personnalisé \n\nVous pouvez personnaliser la clé de propriété de l'objet de classes injectées en donnant une valeur à l'attribut `module` :\n\n```vue\n\n\n\n```\n\n### Utilisation avec la Composition API \n\nLes classes injectées sont accessibles dans `setup()` et `\n\n\n\n\n```" }, "references": [ { @@ -856,7 +856,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nSi vous préférez séparer vos composants `*.vue` en plusieurs fichiers, vous pouvez utiliser l'attribut `src` pour importer un fichier externe pour un bloc de langage :\n\n```vue\n\n\n\n```\n\nAttention, les importations `src` suivent les mêmes règles de résolution de chemin que les requêtes de modules de webpack, ce qui signifie que :\n\n- Les chemins relatifs doivent commencer par `./`.\n- Vous pouvez importer des ressources à partir des dépendances npm :\n\n```vue\n\n\n\n```\n\nAttention, les importations `src` suivent les mêmes règles de résolution de chemin que les requêtes de modules de webpack, ce qui signifie que :\n\n- Les chemins relatifs doivent commencer par `./`.\n- Vous pouvez importer des ressources à partir des dépendances npm :\n\n```vue\n\n\n```\n\nNotez que l'intégration avec divers pré-processeurs peut différer selon les outils utilisés. Consultez la documentation correspondante pour des exemples :\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "Les blocs peuvent déclarer des langages de pré-processeur en utilisant l'attribut `lang`. Le cas le plus courant est l'utilisation de TypeScript pour le bloc `\n```\n\n`lang` peut être appliqué à n'importe quel bloc - par exemple, nous pouvons utiliser `\n```\n\nNotez que l'intégration avec divers pré-processeurs peut différer selon les outils utilisés. Consultez la documentation correspondante pour des exemples :\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [], "references": [ @@ -1041,7 +1041,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nSi vous préférez séparer vos composants `*.vue` en plusieurs fichiers, vous pouvez utiliser l'attribut `src` pour importer un fichier externe pour un bloc de langage :\n\n```vue\n\n\n\n```\n\nAttention, les importations `src` suivent les mêmes règles de résolution de chemin que les requêtes de modules de webpack, ce qui signifie que :\n\n- Les chemins relatifs doivent commencer par `./`.\n- Vous pouvez importer des ressources à partir des dépendances npm :\n\n```vue\n\n\n\n```\n\nAttention, les importations `src` suivent les mêmes règles de résolution de chemin que les requêtes de modules de webpack, ce qui signifie que :\n\n- Les chemins relatifs doivent commencer par `./`.\n- Vous pouvez importer des ressources à partir des dépendances npm :\n\n```vue\n\n\n\n```\n\nTieni presente che gli import `src` seguono le stesse regole di risoluzione del percorso delle richieste dei moduli webpack, il che significa:\n\n- I percorsi relativi devono iniziare con `./`\n- Puoi importare risorse tramite dipendenze npm:\n\n```vue\n\n\n\n```\n\nTieni presente che gli import `src` seguono le stesse regole di risoluzione del percorso delle richieste dei moduli webpack, il che significa:\n\n- I percorsi relativi devono iniziare con `./`\n- Puoi importare risorse tramite dipendenze npm:\n\n```vue\n\n\n```\n\nTieni presente che l'integrazione con diversi pre-processori può variare in base alla catena di strumenti utilizzata. Consulta la rispettiva documentazione per ulteriori esempi:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "I blocchi possono dichiarare linguaggi di pre-processore utilizzando l'attributo `lang`. Il caso più comune è l'utilizzo di TypeScript per il blocco `\n```\n\n`lang` può essere applicato su ogni blocco - per esempio possiamo usare `\n```\n\nTieni presente che l'integrazione con diversi pre-processori può variare in base alla catena di strumenti utilizzata. Consulta la rispettiva documentazione per ulteriori esempi:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [ { @@ -201,7 +201,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nSe preferisci suddividere i tuoi componenti `*.vue` in file multipli, puoi utilizzare l'attributo `src` per importare un file esterno per un blocco di linguaggio:\n\n```vue\n\n\n\n```\n\nTieni presente che gli import `src` seguono le stesse regole di risoluzione del percorso delle richieste dei moduli webpack, il che significa:\n\n- I percorsi relativi devono iniziare con `./`\n- Puoi importare risorse tramite dipendenze npm:\n\n```vue\n\n\n\n```\n\nTieni presente che gli import `src` seguono le stesse regole di risoluzione del percorso delle richieste dei moduli webpack, il che significa:\n\n- I percorsi relativi devono iniziare con `./`\n- Puoi importare risorse tramite dipendenze npm:\n\n```vue\n\n\n```\n\nTieni presente che l'integrazione con diversi pre-processori può variare in base alla catena di strumenti utilizzata. Consulta la rispettiva documentazione per ulteriori esempi:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "I blocchi possono dichiarare linguaggi di pre-processore utilizzando l'attributo `lang`. Il caso più comune è l'utilizzo di TypeScript per il blocco `\n```\n\n`lang` può essere applicato su ogni blocco - per esempio possiamo usare `\n```\n\nTieni presente che l'integrazione con diversi pre-processori può variare in base alla catena di strumenti utilizzata. Consulta la rispettiva documentazione per ulteriori esempi:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [ { @@ -527,7 +527,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nSe preferisci suddividere i tuoi componenti `*.vue` in file multipli, puoi utilizzare l'attributo `src` per importare un file esterno per un blocco di linguaggio:\n\n```vue\n\n\n\n```\n\nTieni presente che gli import `src` seguono le stesse regole di risoluzione del percorso delle richieste dei moduli webpack, il che significa:\n\n- I percorsi relativi devono iniziare con `./`\n- Puoi importare risorse tramite dipendenze npm:\n\n```vue\n\n\n\n```\n\nTieni presente che gli import `src` seguono le stesse regole di risoluzione del percorso delle richieste dei moduli webpack, il che significa:\n\n- I percorsi relativi devono iniziare con `./`\n- Puoi importare risorse tramite dipendenze npm:\n\n```vue\n\n\n```\n\nTieni presente che l'integrazione con diversi pre-processori può variare in base alla catena di strumenti utilizzata. Consulta la rispettiva documentazione per ulteriori esempi:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "I blocchi possono dichiarare linguaggi di pre-processore utilizzando l'attributo `lang`. Il caso più comune è l'utilizzo di TypeScript per il blocco `\n```\n\n`lang` può essere applicato su ogni blocco - per esempio possiamo usare `\n```\n\nTieni presente che l'integrazione con diversi pre-processori può variare in base alla catena di strumenti utilizzata. Consulta la rispettiva documentazione per ulteriori esempi:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [ { @@ -670,7 +670,7 @@ "valueSet": "v", "description": { "kind": "markdown", - "value": "\nQuando un tag `\n\n\n```\n\nIn questo:\n\n```vue\n\n\n\n```\n\n### Elementi Root dei componenti figli \n\nCon l'attributo `scoped`, gli stili del componente genitore non si propagheranno nei componenti figlio. Tuttavia, il nodo radice di un componente figlio sarà influenzato sia dagli stili scoped del genitore che da quelli del figlio. Questo è progettato in modo che il genitore possa stilizzare l'elemento radice del figlio per scopi di layout.\n\n### Selettori in profondità \n\nSe desideri che un selettore negli stili `scoped` abbia effetto anche sui componenti figlio, puoi utilizzare la pseudo-classe `:deep()`:\n\n```vue\n\n```\n\nIl codice sopra verrà compilato in:\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip\nIl contenuto DOM creato con `v-html` non è influenzato dagli stili scoped, ma puoi comunque stilizzarlo utilizzando i selettori deep.\n:::\n\n### Selettori degli slot \n\nPer impostazione predefinita, gli stili scoped non influenzano il contenuto renderizzato da ``, poiché sono considerati di proprietà del componente genitore che li passa. Per puntare in modo esplicito al contenuto dello slot, utilizza la pseudo-classe `:slotted`:\n\n```vue\n\n```\n\n### Selettori globali \n\nSe vuoi applicare una regola globalmente, puoi utilizzare la pseudo-classe `:global` anziché creare un altro blocco `\n```\n\n### Mixare stili locali e globali \n\nPuoi anche includere stili sia scoped che non scoped nello stesso componente:\n\n```vue\n\n\n\n```\n\n### Tips per lo style scoped \n\n- **Gli stili scoped non eliminano la necessità delle classi.**. A causa del modo in cui i browser interpretano i diversi selettori CSS, `p { color: red }` sarà molto più lento quando è scoped (ossia quando è combinato con un selettore di attributo). Se invece usi classi o id, come ad esempio `.example { color: red }`, eliminerai praticamente questo impatto sulle prestazioni.\n\n- **Fai attenzione ai selettori discendenti nei componenti ricorsivi!** Per una regola CSS con il selettore `.a .b`, se l'elemento che corrisponde a `.a` contiene un componente figlio ricorsivo, allora a tutti i `.b` in quel componente figlio verrà applicata quella regola.\n" + "value": "Quando un tag `\n\n\n```\n\nIn questo:\n\n```vue\n\n\n\n```\n\n### Elementi Root dei componenti figli \n\nCon l'attributo `scoped`, gli stili del componente genitore non si propagheranno nei componenti figlio. Tuttavia, il nodo radice di un componente figlio sarà influenzato sia dagli stili scoped del genitore che da quelli del figlio. Questo è progettato in modo che il genitore possa stilizzare l'elemento radice del figlio per scopi di layout.\n\n### Selettori in profondità \n\nSe desideri che un selettore negli stili `scoped` abbia effetto anche sui componenti figlio, puoi utilizzare la pseudo-classe `:deep()`:\n\n```vue\n\n```\n\nIl codice sopra verrà compilato in:\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip\nIl contenuto DOM creato con `v-html` non è influenzato dagli stili scoped, ma puoi comunque stilizzarlo utilizzando i selettori deep.\n:::\n\n### Selettori degli slot \n\nPer impostazione predefinita, gli stili scoped non influenzano il contenuto renderizzato da ``, poiché sono considerati di proprietà del componente genitore che li passa. Per puntare in modo esplicito al contenuto dello slot, utilizza la pseudo-classe `:slotted`:\n\n```vue\n\n```\n\n### Selettori globali \n\nSe vuoi applicare una regola globalmente, puoi utilizzare la pseudo-classe `:global` anziché creare un altro blocco `\n```\n\n### Mixare stili locali e globali \n\nPuoi anche includere stili sia scoped che non scoped nello stesso componente:\n\n```vue\n\n\n\n```\n\n### Tips per lo style scoped \n\n- **Gli stili scoped non eliminano la necessità delle classi.**. A causa del modo in cui i browser interpretano i diversi selettori CSS, `p { color: red }` sarà molto più lento quando è scoped (ossia quando è combinato con un selettore di attributo). Se invece usi classi o id, come ad esempio `.example { color: red }`, eliminerai praticamente questo impatto sulle prestazioni.\n\n- **Fai attenzione ai selettori discendenti nei componenti ricorsivi!** Per una regola CSS con il selettore `.a .b`, se l'elemento che corrisponde a `.a` contiene un componente figlio ricorsivo, allora a tutti i `.b` in quel componente figlio verrà applicata quella regola." }, "references": [ { @@ -732,7 +732,7 @@ "valueSet": "v", "description": { "kind": "markdown", - "value": "\nUn tag `\n```\n\nLe classi risultanti sono hashate per evitare collisioni, ottenendo lo stesso effetto di delimitazione degli stili CSS per il solo componente corrente.\n\nFai riferimento alle [spec dei moduli CSS](https://github.com/css-modules/css-modules) per ulteriori dettagli come le [eccezioni globali](https://github.com/css-modules/css-modules#exceptions) e [composition](https://github.com/css-modules/css-modules#composition).\n\n### Nome Personalizzato per Inject \n\nPuoi personalizzare la chiave di proprietà dell'oggetto delle classi iniettate assegnando un valore all'attributo `module`:\n\n```vue\n\n\n\n```\n\n### Utilizzo con Composition API \n\nPuoi avere accesso alle classi iniettate in `setup()` e `\n```\n\nTieni presente che gli import `src` seguono le stesse regole di risoluzione del percorso delle richieste dei moduli webpack, il che significa:\n\n- I percorsi relativi devono iniziare con `./`\n- Puoi importare risorse tramite dipendenze npm:\n\n```vue\n\n\n\n```\n\nTieni presente che gli import `src` seguono le stesse regole di risoluzione del percorso delle richieste dei moduli webpack, il che significa:\n\n- I percorsi relativi devono iniziare con `./`\n- Puoi importare risorse tramite dipendenze npm:\n\n```vue\n\n\n```\n\nTieni presente che l'integrazione con diversi pre-processori può variare in base alla catena di strumenti utilizzata. Consulta la rispettiva documentazione per ulteriori esempi:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "I blocchi possono dichiarare linguaggi di pre-processore utilizzando l'attributo `lang`. Il caso più comune è l'utilizzo di TypeScript per il blocco `\n```\n\n`lang` può essere applicato su ogni blocco - per esempio possiamo usare `\n```\n\nTieni presente che l'integrazione con diversi pre-processori può variare in base alla catena di strumenti utilizzata. Consulta la rispettiva documentazione per ulteriori esempi:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [], "references": [ @@ -1041,7 +1041,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nSe preferisci suddividere i tuoi componenti `*.vue` in file multipli, puoi utilizzare l'attributo `src` per importare un file esterno per un blocco di linguaggio:\n\n```vue\n\n\n\n```\n\nTieni presente che gli import `src` seguono le stesse regole di risoluzione del percorso delle richieste dei moduli webpack, il che significa:\n\n- I percorsi relativi devono iniziare con `./`\n- Puoi importare risorse tramite dipendenze npm:\n\n```vue\n\n\n\n```\n\nTieni presente che gli import `src` seguono le stesse regole di risoluzione del percorso delle richieste dei moduli webpack, il che significa:\n\n- I percorsi relativi devono iniziare con `./`\n- Puoi importare risorse tramite dipendenze npm:\n\n```vue\n\n\n\n```\n\n`src` でのインポートは webpack のモジュールリクエストと同じパス解決ルールに従うので注意してください。つまり:\n\n- 相対パスは `./` で始める必要があります\n- npm の依存関係からリソースをインポートできます:\n\n```vue\n\n\n\n```\n\n`src` でのインポートは webpack のモジュールリクエストと同じパス解決ルールに従うので注意してください。つまり:\n\n- 相対パスは `./` で始める必要があります\n- npm の依存関係からリソースをインポートできます:\n\n```vue\n\n\n```\n\nなお、各種プリプロセッサーとの統合はツールチェーンによって異なる場合があることに注意してください。例については、それぞれのドキュメントを参照してください:\n\n- [Vite](https://ja.vitejs.dev/guide/features.html#css-%E3%83%97%E3%83%AA%E3%83%97%E3%83%AD%E3%82%BB%E3%83%83%E3%82%B5)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "ブロックに `lang` 属性を使ってプリプロセッサーの言語を宣言できます。最も一般的なケースは、`\n```\n\n`lang` はどのブロックにも適用できます - 例えば、`\n```\n\nなお、各種プリプロセッサーとの統合はツールチェーンによって異なる場合があることに注意してください。例については、それぞれのドキュメントを参照してください:\n\n- [Vite](https://ja.vitejs.dev/guide/features.html#css-%E3%83%97%E3%83%AA%E3%83%97%E3%83%AD%E3%82%BB%E3%83%83%E3%82%B5)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [ { @@ -201,7 +201,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\n`*.vue` コンポーネントを複数のファイルに分割したい場合は、`src` 属性を使用して言語ブロックに外部ファイルをインポートできます:\n\n```vue\n\n\n\n```\n\n`src` でのインポートは webpack のモジュールリクエストと同じパス解決ルールに従うので注意してください。つまり:\n\n- 相対パスは `./` で始める必要があります\n- npm の依存関係からリソースをインポートできます:\n\n```vue\n\n\n\n```\n\n`src` でのインポートは webpack のモジュールリクエストと同じパス解決ルールに従うので注意してください。つまり:\n\n- 相対パスは `./` で始める必要があります\n- npm の依存関係からリソースをインポートできます:\n\n```vue\n\n\n```\n\nなお、各種プリプロセッサーとの統合はツールチェーンによって異なる場合があることに注意してください。例については、それぞれのドキュメントを参照してください:\n\n- [Vite](https://ja.vitejs.dev/guide/features.html#css-%E3%83%97%E3%83%AA%E3%83%97%E3%83%AD%E3%82%BB%E3%83%83%E3%82%B5)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "ブロックに `lang` 属性を使ってプリプロセッサーの言語を宣言できます。最も一般的なケースは、`\n```\n\n`lang` はどのブロックにも適用できます - 例えば、`\n```\n\nなお、各種プリプロセッサーとの統合はツールチェーンによって異なる場合があることに注意してください。例については、それぞれのドキュメントを参照してください:\n\n- [Vite](https://ja.vitejs.dev/guide/features.html#css-%E3%83%97%E3%83%AA%E3%83%97%E3%83%AD%E3%82%BB%E3%83%83%E3%82%B5)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [ { @@ -527,7 +527,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\n`*.vue` コンポーネントを複数のファイルに分割したい場合は、`src` 属性を使用して言語ブロックに外部ファイルをインポートできます:\n\n```vue\n\n\n\n```\n\n`src` でのインポートは webpack のモジュールリクエストと同じパス解決ルールに従うので注意してください。つまり:\n\n- 相対パスは `./` で始める必要があります\n- npm の依存関係からリソースをインポートできます:\n\n```vue\n\n\n\n```\n\n`src` でのインポートは webpack のモジュールリクエストと同じパス解決ルールに従うので注意してください。つまり:\n\n- 相対パスは `./` で始める必要があります\n- npm の依存関係からリソースをインポートできます:\n\n```vue\n\n\n```\n\nなお、各種プリプロセッサーとの統合はツールチェーンによって異なる場合があることに注意してください。例については、それぞれのドキュメントを参照してください:\n\n- [Vite](https://ja.vitejs.dev/guide/features.html#css-%E3%83%97%E3%83%AA%E3%83%97%E3%83%AD%E3%82%BB%E3%83%83%E3%82%B5)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "ブロックに `lang` 属性を使ってプリプロセッサーの言語を宣言できます。最も一般的なケースは、`\n```\n\n`lang` はどのブロックにも適用できます - 例えば、`\n```\n\nなお、各種プリプロセッサーとの統合はツールチェーンによって異なる場合があることに注意してください。例については、それぞれのドキュメントを参照してください:\n\n- [Vite](https://ja.vitejs.dev/guide/features.html#css-%E3%83%97%E3%83%AA%E3%83%97%E3%83%AD%E3%82%BB%E3%83%83%E3%82%B5)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [ { @@ -670,7 +670,7 @@ "valueSet": "v", "description": { "kind": "markdown", - "value": "\n`\n\n\n```\n\n以下のように変換されます:\n\n```vue\n\n\n\n```\n\n### 子コンポーネントのルート要素 \n\n`scoped` を使用すると、親コンポーネントのスタイルが子コンポーネントに漏れることはありません。しかし、子コンポーネントのルートノードは親のスコープ付き CSS と子のスコープ付き CSS の両方の影響を受けることになります。これは、親コンポーネントがレイアウトのために子コンポーネントのルート要素のスタイルを設定できるようにするための設計です。\n\n### deep セレクター \n\n`scoped` スタイルのセレクターを \"deep\" にしたい場合、つまり子コンポーネントに影響を与えたい場合は、`:deep()` 擬似クラスを使用できます:\n\n```vue\n\n```\n\n上記は次のようにコンパイルされます:\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip\n`v-html` で作成された DOM コンテンツは、スコープ付きスタイルの影響を受けませんが、deep セレクターを使用してスタイルを設定可能です。\n:::\n\n### slotted セレクター \n\n`` によってレンダリングされるコンテンツは、デフォルトでは親コンポーネントによって所有されていると見なされるため、スコープ付きスタイルの影響を受けません。明示的にスロットのコンテンツをターゲットにするには、`:slotted` 疑似クラスを使用します:\n\n```vue\n\n```\n\n### global セレクター \n\nもし 1 つのルールだけをグローバルに適用したい場合は、別の `\n```\n\n### ローカルスタイルとグローバルスタイルの混在 \n\nスコープ付きスタイルとスコープなしスタイルの両方を同じコンポーネントに含めることもできます:\n\n```vue\n\n\n\n```\n\n### スコープ付きスタイルのヒント \n\n- **スコープ付きスタイルでクラスが不要になるわけではありません**。ブラウザーの様々な CSS セレクターのレンダリング方法により、`p { color: red }` をスコープ付きにした場合(つまり属性セレクターと組み合わせた場合)、何倍も遅くなります。その代わり、`.example { color: red }` のようにクラスや ID を使用すれば、このパフォーマンス低下をほぼ排除できます。\n\n- **再帰的コンポーネントでの子孫セレクターに注意!** `.a .b` というセレクターがある CSS ルールにおいて、`.a` にマッチする要素が再帰的な子コンポーネントを含む場合、その子コンポーネントのすべての `.b` がルールにマッチされます。\n" + "value": "`\n\n\n```\n\n以下のように変換されます:\n\n```vue\n\n\n\n```\n\n### 子コンポーネントのルート要素 \n\n`scoped` を使用すると、親コンポーネントのスタイルが子コンポーネントに漏れることはありません。しかし、子コンポーネントのルートノードは親のスコープ付き CSS と子のスコープ付き CSS の両方の影響を受けることになります。これは、親コンポーネントがレイアウトのために子コンポーネントのルート要素のスタイルを設定できるようにするための設計です。\n\n### deep セレクター \n\n`scoped` スタイルのセレクターを \"deep\" にしたい場合、つまり子コンポーネントに影響を与えたい場合は、`:deep()` 擬似クラスを使用できます:\n\n```vue\n\n```\n\n上記は次のようにコンパイルされます:\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip\n`v-html` で作成された DOM コンテンツは、スコープ付きスタイルの影響を受けませんが、deep セレクターを使用してスタイルを設定可能です。\n:::\n\n### slotted セレクター \n\n`` によってレンダリングされるコンテンツは、デフォルトでは親コンポーネントによって所有されていると見なされるため、スコープ付きスタイルの影響を受けません。明示的にスロットのコンテンツをターゲットにするには、`:slotted` 疑似クラスを使用します:\n\n```vue\n\n```\n\n### global セレクター \n\nもし 1 つのルールだけをグローバルに適用したい場合は、別の `\n```\n\n### ローカルスタイルとグローバルスタイルの混在 \n\nスコープ付きスタイルとスコープなしスタイルの両方を同じコンポーネントに含めることもできます:\n\n```vue\n\n\n\n```\n\n### スコープ付きスタイルのヒント \n\n- **スコープ付きスタイルでクラスが不要になるわけではありません**。ブラウザーの様々な CSS セレクターのレンダリング方法により、`p { color: red }` をスコープ付きにした場合(つまり属性セレクターと組み合わせた場合)、何倍も遅くなります。その代わり、`.example { color: red }` のようにクラスや ID を使用すれば、このパフォーマンス低下をほぼ排除できます。\n\n- **再帰的コンポーネントでの子孫セレクターに注意!** `.a .b` というセレクターがある CSS ルールにおいて、`.a` にマッチする要素が再帰的な子コンポーネントを含む場合、その子コンポーネントのすべての `.b` がルールにマッチされます。" }, "references": [ { @@ -732,7 +732,7 @@ "valueSet": "v", "description": { "kind": "markdown", - "value": "\n`\n```\n\n生成されたクラスは衝突を避けるためにハッシュ化され、CSS を現在のコンポーネントのみにスコープするのと同じ効果を得ることができます。\n\n[グローバルの例外](https://github.com/css-modules/css-modules/blob/master/docs/composition.md#exceptions)や[コンポジション](https://github.com/css-modules/css-modules/blob/master/docs/composition.md#composition)などの詳細は、[CSS モジュールの仕様](https://github.com/css-modules/css-modules)を参照してください。\n\n### カスタム注入名 \n\n`module` 属性に値を与えることで、注入されるクラスオブジェクトのプロパティキーをカスタマイズできます:\n\n```vue\n\n\n\n```\n\n### Composition API での使用 \n\n注入されたクラスは、`useCssModule` API を介して `setup()` や `\n\n\n\n\n```" }, "references": [ { @@ -856,7 +856,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\n`*.vue` コンポーネントを複数のファイルに分割したい場合は、`src` 属性を使用して言語ブロックに外部ファイルをインポートできます:\n\n```vue\n\n\n\n```\n\n`src` でのインポートは webpack のモジュールリクエストと同じパス解決ルールに従うので注意してください。つまり:\n\n- 相対パスは `./` で始める必要があります\n- npm の依存関係からリソースをインポートできます:\n\n```vue\n\n\n\n```\n\n`src` でのインポートは webpack のモジュールリクエストと同じパス解決ルールに従うので注意してください。つまり:\n\n- 相対パスは `./` で始める必要があります\n- npm の依存関係からリソースをインポートできます:\n\n```vue\n\n\n```\n\nなお、各種プリプロセッサーとの統合はツールチェーンによって異なる場合があることに注意してください。例については、それぞれのドキュメントを参照してください:\n\n- [Vite](https://ja.vitejs.dev/guide/features.html#css-%E3%83%97%E3%83%AA%E3%83%97%E3%83%AD%E3%82%BB%E3%83%83%E3%82%B5)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "ブロックに `lang` 属性を使ってプリプロセッサーの言語を宣言できます。最も一般的なケースは、`\n```\n\n`lang` はどのブロックにも適用できます - 例えば、`\n```\n\nなお、各種プリプロセッサーとの統合はツールチェーンによって異なる場合があることに注意してください。例については、それぞれのドキュメントを参照してください:\n\n- [Vite](https://ja.vitejs.dev/guide/features.html#css-%E3%83%97%E3%83%AA%E3%83%97%E3%83%AD%E3%82%BB%E3%83%83%E3%82%B5)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [], "references": [ @@ -1041,7 +1041,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\n`*.vue` コンポーネントを複数のファイルに分割したい場合は、`src` 属性を使用して言語ブロックに外部ファイルをインポートできます:\n\n```vue\n\n\n\n```\n\n`src` でのインポートは webpack のモジュールリクエストと同じパス解決ルールに従うので注意してください。つまり:\n\n- 相対パスは `./` で始める必要があります\n- npm の依存関係からリソースをインポートできます:\n\n```vue\n\n\n\n```\n\n`src` でのインポートは webpack のモジュールリクエストと同じパス解決ルールに従うので注意してください。つまり:\n\n- 相対パスは `./` で始める必要があります\n- npm の依存関係からリソースをインポートできます:\n\n```vue\n\n\n\n```\n\n`src` 가져오기는 웹팩 모듈 요청과 동일한 경로 확인 규칙을 따릅니다.\n즉, 다음을 의미합니다:\n\n- 상대 경로는 `./`로 시작해야 함.\n- npm 의존성에서 리소스를 가져올 수 있음.\n\n```vue\n\n\n\n```\n\n`src` 가져오기는 웹팩 모듈 요청과 동일한 경로 확인 규칙을 따릅니다.\n즉, 다음을 의미합니다:\n\n- 상대 경로는 `./`로 시작해야 함.\n- npm 의존성에서 리소스를 가져올 수 있음.\n\n```vue\n\n\n```\n\n다양한 전처리기와의 통합은 툴체인에 따라 다를 수 있습니다.\n예제를 보려면 해당 문서를 확인하십시오:\n\n- [Vite](https://vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors#using-pre-processors)\n" + "value": "블록은 `lang` 속성을 사용하여 전처리기 언어를 선언할 수 있습니다.\n가장 일반적인 경우는 `\n```\n\n`lang`은 모든 블록에 적용할 수 있습니다.\n예를 들어 `\n```\n\n다양한 전처리기와의 통합은 툴체인에 따라 다를 수 있습니다.\n예제를 보려면 해당 문서를 확인하십시오:\n\n- [Vite](https://vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors#using-pre-processors)" }, "values": [ { @@ -201,7 +201,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\n`*.vue` 컴포넌트를 여러 파일로 분할하는 것을 선호하는 경우,\n`src` 속성을 사용하여 언어 블록에서 외부 파일을 가져올 수 있습니다:\n\n```vue\n\n\n\n```\n\n`src` 가져오기는 웹팩 모듈 요청과 동일한 경로 확인 규칙을 따릅니다.\n즉, 다음을 의미합니다:\n\n- 상대 경로는 `./`로 시작해야 함.\n- npm 의존성에서 리소스를 가져올 수 있음.\n\n```vue\n\n\n\n```\n\n`src` 가져오기는 웹팩 모듈 요청과 동일한 경로 확인 규칙을 따릅니다.\n즉, 다음을 의미합니다:\n\n- 상대 경로는 `./`로 시작해야 함.\n- npm 의존성에서 리소스를 가져올 수 있음.\n\n```vue\n\n\n```\n\n다양한 전처리기와의 통합은 툴체인에 따라 다를 수 있습니다.\n예제를 보려면 해당 문서를 확인하십시오:\n\n- [Vite](https://vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors#using-pre-processors)\n" + "value": "블록은 `lang` 속성을 사용하여 전처리기 언어를 선언할 수 있습니다.\n가장 일반적인 경우는 `\n```\n\n`lang`은 모든 블록에 적용할 수 있습니다.\n예를 들어 `\n```\n\n다양한 전처리기와의 통합은 툴체인에 따라 다를 수 있습니다.\n예제를 보려면 해당 문서를 확인하십시오:\n\n- [Vite](https://vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors#using-pre-processors)" }, "values": [ { @@ -527,7 +527,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\n`*.vue` 컴포넌트를 여러 파일로 분할하는 것을 선호하는 경우,\n`src` 속성을 사용하여 언어 블록에서 외부 파일을 가져올 수 있습니다:\n\n```vue\n\n\n\n```\n\n`src` 가져오기는 웹팩 모듈 요청과 동일한 경로 확인 규칙을 따릅니다.\n즉, 다음을 의미합니다:\n\n- 상대 경로는 `./`로 시작해야 함.\n- npm 의존성에서 리소스를 가져올 수 있음.\n\n```vue\n\n\n\n```\n\n`src` 가져오기는 웹팩 모듈 요청과 동일한 경로 확인 규칙을 따릅니다.\n즉, 다음을 의미합니다:\n\n- 상대 경로는 `./`로 시작해야 함.\n- npm 의존성에서 리소스를 가져올 수 있음.\n\n```vue\n\n\n```\n\n다양한 전처리기와의 통합은 툴체인에 따라 다를 수 있습니다.\n예제를 보려면 해당 문서를 확인하십시오:\n\n- [Vite](https://vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors#using-pre-processors)\n" + "value": "블록은 `lang` 속성을 사용하여 전처리기 언어를 선언할 수 있습니다.\n가장 일반적인 경우는 `\n```\n\n`lang`은 모든 블록에 적용할 수 있습니다.\n예를 들어 `\n```\n\n다양한 전처리기와의 통합은 툴체인에 따라 다를 수 있습니다.\n예제를 보려면 해당 문서를 확인하십시오:\n\n- [Vite](https://vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors#using-pre-processors)" }, "values": [ { @@ -670,7 +670,7 @@ "valueSet": "v", "description": { "kind": "markdown", - "value": "\n`\n\n\n```\n\n다음으로:\n\n```vue\n\n\n\n```\n\n### 자식 컴포넌트 루트 엘리먼트 \n\n`scoped`를 사용하면 부모 컴포넌트의 스타일이 자식 컴포넌트로 누출되지 않습니다. 그러나 자식 컴포넌트의 루트 노드는 부모의 범위가 지정된 CSS와 자식의 범위가 지정된 CSS 모두의 영향을 받습니다. 이것은 부모가 레이아웃 목적으로 자식 루트 엘리먼트의 스타일을 지정할 수 있도록 의도적으로 설계된 것입니다:\n\n### 깊은 셀렉터 \n\n`scoped` 스타일의 셀렉터를 \"깊게\"(즉, 자식 컴포넌트에 영향을 미치게 하려면) `:deep()` 의사 클래스를 사용할 수 있습니다:\n\n```vue\n\n```\n\n위의 내용은 다음과 같이 컴파일됩니다:\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip\n`v-html`로 만든 DOM 컨텐츠는 범위가 지정된 스타일의 영향을 받지 않지만, 깊은 셀렉터를 사용하여 스타일을 지정할 수 있습니다.\n:::\n\n### 슬롯형 셀렉터 \n\n기본적으로 범위가 지정된 스타일은 ``에 의해 렌더링된 컨텐츠에 영향을 미치지 않습니다. 스타일을 전달하는 부모 컴포넌트가 소유한 것으로 간주되기 때문입니다. 슬롯 컨텐츠를 명시적으로 대상으로 지정하려면, `:slotted` 의사 클래스를 사용해야 합니다:\n\n```vue\n\n```\n\n### 전역 셀렉터 \n\n하나의 규칙만 전역적으로 적용하려면, 다른 `\n```\n\n### 로컬 및 전역 스타일 혼합 \n\n동일한 컴포넌트에 범위가 지정된 스타일과 범위가 지정되지 않은 스타일을 모두 포함할 수도 있습니다:\n\n```vue\n\n\n\n```\n\n### 범위가 지정된 스타일 팁 \n\n- **범위가 지정된 스타일은 클래스의 필요성을 제거하지 않습니다**. 브라우저가 다양한 CSS 셀렉터를 렌더링하는 방식 때문에, `p { color: red }`처럼 범위를 지정할 때(즉, 속성 셀렉터와 결합될 때) 속도가 몇 배 느려집니다. `.example { color: red }`와 같이 클래스나 ID를 사용하면, 성능 저하를 거의 제거할 수 있습니다.\n\n- **재귀적 컴포넌트의 자손 셀렉터에 주의해야 합니다!** 셀렉터가 `.a .b`인 CSS 규칙의 경우, `.a`와 일치하는 엘리먼트가 재귀적인 자식 컴포넌트를 포함한다면, 해당 자식 컴포넌트의 모든 `.b`는 규칙과 일치하게 됩니다.\n" + "value": "`\n\n\n```\n\n다음으로:\n\n```vue\n\n\n\n```\n\n### 자식 컴포넌트 루트 엘리먼트 \n\n`scoped`를 사용하면 부모 컴포넌트의 스타일이 자식 컴포넌트로 누출되지 않습니다. 그러나 자식 컴포넌트의 루트 노드는 부모의 범위가 지정된 CSS와 자식의 범위가 지정된 CSS 모두의 영향을 받습니다. 이것은 부모가 레이아웃 목적으로 자식 루트 엘리먼트의 스타일을 지정할 수 있도록 의도적으로 설계된 것입니다:\n\n### 깊은 셀렉터 \n\n`scoped` 스타일의 셀렉터를 \"깊게\"(즉, 자식 컴포넌트에 영향을 미치게 하려면) `:deep()` 의사 클래스를 사용할 수 있습니다:\n\n```vue\n\n```\n\n위의 내용은 다음과 같이 컴파일됩니다:\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip\n`v-html`로 만든 DOM 컨텐츠는 범위가 지정된 스타일의 영향을 받지 않지만, 깊은 셀렉터를 사용하여 스타일을 지정할 수 있습니다.\n:::\n\n### 슬롯형 셀렉터 \n\n기본적으로 범위가 지정된 스타일은 ``에 의해 렌더링된 컨텐츠에 영향을 미치지 않습니다. 스타일을 전달하는 부모 컴포넌트가 소유한 것으로 간주되기 때문입니다. 슬롯 컨텐츠를 명시적으로 대상으로 지정하려면, `:slotted` 의사 클래스를 사용해야 합니다:\n\n```vue\n\n```\n\n### 전역 셀렉터 \n\n하나의 규칙만 전역적으로 적용하려면, 다른 `\n```\n\n### 로컬 및 전역 스타일 혼합 \n\n동일한 컴포넌트에 범위가 지정된 스타일과 범위가 지정되지 않은 스타일을 모두 포함할 수도 있습니다:\n\n```vue\n\n\n\n```\n\n### 범위가 지정된 스타일 팁 \n\n- **범위가 지정된 스타일은 클래스의 필요성을 제거하지 않습니다**. 브라우저가 다양한 CSS 셀렉터를 렌더링하는 방식 때문에, `p { color: red }`처럼 범위를 지정할 때(즉, 속성 셀렉터와 결합될 때) 속도가 몇 배 느려집니다. `.example { color: red }`와 같이 클래스나 ID를 사용하면, 성능 저하를 거의 제거할 수 있습니다.\n\n- **재귀적 컴포넌트의 자손 셀렉터에 주의해야 합니다!** 셀렉터가 `.a .b`인 CSS 규칙의 경우, `.a`와 일치하는 엘리먼트가 재귀적인 자식 컴포넌트를 포함한다면, 해당 자식 컴포넌트의 모든 `.b`는 규칙과 일치하게 됩니다." }, "references": [ { @@ -732,7 +732,7 @@ "valueSet": "v", "description": { "kind": "markdown", - "value": "\n`\n```\n\n결과적인 클래스는 충돌을 피하기 위해 해시되어, CSS 범위를 현재 컴포넌트로만 지정하는 것과 동일한 효과를 얻습니다.\n\n[전역 예외](https://github.com/css-modules/css-modules/blob/master/docs/composition.md#exceptions), [컴포지션](https://github.com/css-modules/css-modules/blob/master/docs/composition.md#composition) 등의 자세한 사항은 [CSS 모듈 스팩](https://github.com/css-modules/css-modules)을 참고하십시오.\n\n### 커스텀 이름 삽입 \n\n`module` 속성에 값을 지정하여, 주입된 클래스 객체의 속성 키를 커스텀할 수 있습니다:\n\n```vue\n\n\n\n```\n\n### 컴포지션 API와 함께 사용 \n\n주입된 클래스는 `useCssModule` API를 통해 `setup()` 및 `\n```\n\n`src` 가져오기는 웹팩 모듈 요청과 동일한 경로 확인 규칙을 따릅니다.\n즉, 다음을 의미합니다:\n\n- 상대 경로는 `./`로 시작해야 함.\n- npm 의존성에서 리소스를 가져올 수 있음.\n\n```vue\n\n\n\n```\n\n`src` 가져오기는 웹팩 모듈 요청과 동일한 경로 확인 규칙을 따릅니다.\n즉, 다음을 의미합니다:\n\n- 상대 경로는 `./`로 시작해야 함.\n- npm 의존성에서 리소스를 가져올 수 있음.\n\n```vue\n\n\n```\n\n다양한 전처리기와의 통합은 툴체인에 따라 다를 수 있습니다.\n예제를 보려면 해당 문서를 확인하십시오:\n\n- [Vite](https://vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors#using-pre-processors)\n" + "value": "블록은 `lang` 속성을 사용하여 전처리기 언어를 선언할 수 있습니다.\n가장 일반적인 경우는 `\n```\n\n`lang`은 모든 블록에 적용할 수 있습니다.\n예를 들어 `\n```\n\n다양한 전처리기와의 통합은 툴체인에 따라 다를 수 있습니다.\n예제를 보려면 해당 문서를 확인하십시오:\n\n- [Vite](https://vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors#using-pre-processors)" }, "values": [], "references": [ @@ -1041,7 +1041,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\n`*.vue` 컴포넌트를 여러 파일로 분할하는 것을 선호하는 경우,\n`src` 속성을 사용하여 언어 블록에서 외부 파일을 가져올 수 있습니다:\n\n```vue\n\n\n\n```\n\n`src` 가져오기는 웹팩 모듈 요청과 동일한 경로 확인 규칙을 따릅니다.\n즉, 다음을 의미합니다:\n\n- 상대 경로는 `./`로 시작해야 함.\n- npm 의존성에서 리소스를 가져올 수 있음.\n\n```vue\n\n\n\n```\n\n`src` 가져오기는 웹팩 모듈 요청과 동일한 경로 확인 규칙을 따릅니다.\n즉, 다음을 의미합니다:\n\n- 상대 경로는 `./`로 시작해야 함.\n- npm 의존성에서 리소스를 가져올 수 있음.\n\n```vue\n\n\n\n```\n\nDevemos estar ciente de que as importações de `src` seguem as mesmas regras de resolução de caminho que as requisições de módulo da Webpack, o que significa que:\n\n- Os caminhos relativos precisam começar com `./`\n- Nós podemos importar recursos a partir das dependências do npm:\n\n```vue\n\n\n\n```\n\nDevemos estar ciente de que as importações de `src` seguem as mesmas regras de resolução de caminho que as requisições de módulo da Webpack, o que significa que:\n\n- Os caminhos relativos precisam começar com `./`\n- Nós podemos importar recursos a partir das dependências do npm:\n\n```vue\n\n\n```\n\nNota que a integração com os vários pré-processadores pode diferir conforme a cadeia de ferramenta. Consulte a respetiva documentação por exemplos:\n\n- [Vite](https://pt.vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "Os blocos podem declarar linguagens pré-processadoras usando o atributo `lang`. O caso mais comum é usar TypeScript para o bloco `\n```\n\n`lang` pode ser aplicado à qualquer bloco - por exemplo, podemos usar o `\n```\n\nNota que a integração com os vários pré-processadores pode diferir conforme a cadeia de ferramenta. Consulte a respetiva documentação por exemplos:\n\n- [Vite](https://pt.vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [ { @@ -201,7 +201,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nSe preferirmos separar os nossos componentes `*.vue` em vários ficheiros, podemos usar o atributo `src` para importar um ficheiro externo para um bloco de linguagem:\n\n```vue\n\n\n\n```\n\nDevemos estar ciente de que as importações de `src` seguem as mesmas regras de resolução de caminho que as requisições de módulo da Webpack, o que significa que:\n\n- Os caminhos relativos precisam começar com `./`\n- Nós podemos importar recursos a partir das dependências do npm:\n\n```vue\n\n\n\n```\n\nDevemos estar ciente de que as importações de `src` seguem as mesmas regras de resolução de caminho que as requisições de módulo da Webpack, o que significa que:\n\n- Os caminhos relativos precisam começar com `./`\n- Nós podemos importar recursos a partir das dependências do npm:\n\n```vue\n\n\n```\n\nNota que a integração com os vários pré-processadores pode diferir conforme a cadeia de ferramenta. Consulte a respetiva documentação por exemplos:\n\n- [Vite](https://pt.vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "Os blocos podem declarar linguagens pré-processadoras usando o atributo `lang`. O caso mais comum é usar TypeScript para o bloco `\n```\n\n`lang` pode ser aplicado à qualquer bloco - por exemplo, podemos usar o `\n```\n\nNota que a integração com os vários pré-processadores pode diferir conforme a cadeia de ferramenta. Consulte a respetiva documentação por exemplos:\n\n- [Vite](https://pt.vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [ { @@ -527,7 +527,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nSe preferirmos separar os nossos componentes `*.vue` em vários ficheiros, podemos usar o atributo `src` para importar um ficheiro externo para um bloco de linguagem:\n\n```vue\n\n\n\n```\n\nDevemos estar ciente de que as importações de `src` seguem as mesmas regras de resolução de caminho que as requisições de módulo da Webpack, o que significa que:\n\n- Os caminhos relativos precisam começar com `./`\n- Nós podemos importar recursos a partir das dependências do npm:\n\n```vue\n\n\n\n```\n\nDevemos estar ciente de que as importações de `src` seguem as mesmas regras de resolução de caminho que as requisições de módulo da Webpack, o que significa que:\n\n- Os caminhos relativos precisam começar com `./`\n- Nós podemos importar recursos a partir das dependências do npm:\n\n```vue\n\n\n```\n\nNota que a integração com os vários pré-processadores pode diferir conforme a cadeia de ferramenta. Consulte a respetiva documentação por exemplos:\n\n- [Vite](https://pt.vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "Os blocos podem declarar linguagens pré-processadoras usando o atributo `lang`. O caso mais comum é usar TypeScript para o bloco `\n```\n\n`lang` pode ser aplicado à qualquer bloco - por exemplo, podemos usar o `\n```\n\nNota que a integração com os vários pré-processadores pode diferir conforme a cadeia de ferramenta. Consulte a respetiva documentação por exemplos:\n\n- [Vite](https://pt.vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [ { @@ -670,7 +670,7 @@ "valueSet": "v", "description": { "kind": "markdown", - "value": "\nQuando um marcador `\n\n\n```\n\nNo seguinte:\n\n```vue\n\n\n\n```\n\n### Elementos de Raiz do Componente Filho \n\nCom `scoped`, os estilos do componente pai não passarão para os componentes filhos. No entanto, um nó de raiz do componente filho será afetado por ambas CSS isolada do pai e a CSS isolada do filho. Isto é de propósito para que o pai possa estilizar o elemento de raiz filho para fins de disposição.\n\n### Seletores Profundos \n\nSe quisermos que um seletor nos estilos `scoped` torne-se \"profundo\", ou seja, afete componentes filho, podemos usar a pseudo-classe `:deep()`:\n\n```vue\n\n```\n\nO código acima será compilado para:\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip DICA\nOs conteúdos do DOM criados com `v-html` não são afetados pelos estilos isolados, mas ainda podemos estilizá-los usando seletores profundos.\n:::\n\n### Seletores Inseridos \n\nPor padrão, os estilos isolados não afetam os conteúdos interpretados pelo ``, uma vez que são considerados ser propriedade do componente pai que está a passá-los. Para explicitamente atingir o conteúdo da ranhura, usamos a pseudo-classe `:slotted`:\n\n```vue\n\n```\n\n### Seletores Globais \n\nSe quisermos que apenas uma regra aplique-se globalmente, podemos usar a pseudo-classe `:global` ao invés de criar um outro `\n```\n\n### Misturando Estilos Locais e Globais \n\nNós também podemos incluir ambos estilos isolados e não isolados no mesmo componente:\n\n```vue\n\n\n\n```\n\n### Dicas de Estilo Isolado \n\n- **Os estilos isolados não eliminam a necessidade de classes**. Por causa da maneira que os navegadores interpretam os vários seletores de CSS, `p { color: red }` será muitas vezes mais lento quando isolado (ou seja, quando combinado com um seletor de atributo). Se usarmos as classes (por exemplo, `.class-name`) ou identificadores (por exemplo, `#id-name`), tal como em `.example { color: red }`, então eliminamos virtualmente este impacto de desempenho.\n\n- **Temos que ter cuidado com os seletores de descendentes nos componentes recursivos!** Para um regara de CSS com o seletor `.a .b`, se o elemento que corresponde `.a` contiver um componente filho recursivo, então todos os `.b` neste componente filho serão correspondidos pela regra.\n" + "value": "Quando um marcador `\n\n\n```\n\nNo seguinte:\n\n```vue\n\n\n\n```\n\n### Elementos de Raiz do Componente Filho \n\nCom `scoped`, os estilos do componente pai não passarão para os componentes filhos. No entanto, um nó de raiz do componente filho será afetado por ambas CSS isolada do pai e a CSS isolada do filho. Isto é de propósito para que o pai possa estilizar o elemento de raiz filho para fins de disposição.\n\n### Seletores Profundos \n\nSe quisermos que um seletor nos estilos `scoped` torne-se \"profundo\", ou seja, afete componentes filho, podemos usar a pseudo-classe `:deep()`:\n\n```vue\n\n```\n\nO código acima será compilado para:\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip DICA\nOs conteúdos do DOM criados com `v-html` não são afetados pelos estilos isolados, mas ainda podemos estilizá-los usando seletores profundos.\n:::\n\n### Seletores Inseridos \n\nPor padrão, os estilos isolados não afetam os conteúdos interpretados pelo ``, uma vez que são considerados ser propriedade do componente pai que está a passá-los. Para explicitamente atingir o conteúdo da ranhura, usamos a pseudo-classe `:slotted`:\n\n```vue\n\n```\n\n### Seletores Globais \n\nSe quisermos que apenas uma regra aplique-se globalmente, podemos usar a pseudo-classe `:global` ao invés de criar um outro `\n```\n\n### Misturando Estilos Locais e Globais \n\nNós também podemos incluir ambos estilos isolados e não isolados no mesmo componente:\n\n```vue\n\n\n\n```\n\n### Dicas de Estilo Isolado \n\n- **Os estilos isolados não eliminam a necessidade de classes**. Por causa da maneira que os navegadores interpretam os vários seletores de CSS, `p { color: red }` será muitas vezes mais lento quando isolado (ou seja, quando combinado com um seletor de atributo). Se usarmos as classes (por exemplo, `.class-name`) ou identificadores (por exemplo, `#id-name`), tal como em `.example { color: red }`, então eliminamos virtualmente este impacto de desempenho.\n\n- **Temos que ter cuidado com os seletores de descendentes nos componentes recursivos!** Para um regara de CSS com o seletor `.a .b`, se o elemento que corresponde `.a` contiver um componente filho recursivo, então todos os `.b` neste componente filho serão correspondidos pela regra." }, "references": [ { @@ -732,7 +732,7 @@ "valueSet": "v", "description": { "kind": "markdown", - "value": "\nUm marcador `\n```\n\nAs classes resultantes têm o seu nome gerados com caracteres embaralhados para evitar colisões, alcançando o mesmo efeito de isolar o CSS apenas ao componente atual.\n\nConsulte a [especificação dos Módulos de CSS](https://github.com/css-modules/css-modules) por mais detalhes, tais como [exceções globais](https://github.com/css-modules/css-modules/blob/master/docs/composition.md#exceptions) e [composição](https://github.com/css-modules/css-modules#composition).\n\n### Nome de Injeção Personalizado \n\nNós podemos personalizar a chave da propriedade do objeto de classes injetadas dando ao atributo `module` um valor:\n\n```vue\n\n\n\n```\n\n### Uso com API de Composição \n\nAs classes injetadas podem ser acessadas na `setup()` e no `\n```\n\nDevemos estar ciente de que as importações de `src` seguem as mesmas regras de resolução de caminho que as requisições de módulo da Webpack, o que significa que:\n\n- Os caminhos relativos precisam começar com `./`\n- Nós podemos importar recursos a partir das dependências do npm:\n\n```vue\n\n\n\n```\n\nDevemos estar ciente de que as importações de `src` seguem as mesmas regras de resolução de caminho que as requisições de módulo da Webpack, o que significa que:\n\n- Os caminhos relativos precisam começar com `./`\n- Nós podemos importar recursos a partir das dependências do npm:\n\n```vue\n\n\n```\n\nNota que a integração com os vários pré-processadores pode diferir conforme a cadeia de ferramenta. Consulte a respetiva documentação por exemplos:\n\n- [Vite](https://pt.vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n" + "value": "Os blocos podem declarar linguagens pré-processadoras usando o atributo `lang`. O caso mais comum é usar TypeScript para o bloco `\n```\n\n`lang` pode ser aplicado à qualquer bloco - por exemplo, podemos usar o `\n```\n\nNota que a integração com os vários pré-processadores pode diferir conforme a cadeia de ferramenta. Consulte a respetiva documentação por exemplos:\n\n- [Vite](https://pt.vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [], "references": [ @@ -1041,7 +1041,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nSe preferirmos separar os nossos componentes `*.vue` em vários ficheiros, podemos usar o atributo `src` para importar um ficheiro externo para um bloco de linguagem:\n\n```vue\n\n\n\n```\n\nDevemos estar ciente de que as importações de `src` seguem as mesmas regras de resolução de caminho que as requisições de módulo da Webpack, o que significa que:\n\n- Os caminhos relativos precisam começar com `./`\n- Nós podemos importar recursos a partir das dependências do npm:\n\n```vue\n\n\n\n```\n\nDevemos estar ciente de que as importações de `src` seguem as mesmas regras de resolução de caminho que as requisições de módulo da Webpack, o que significa que:\n\n- Os caminhos relativos precisam começar com `./`\n- Nós podemos importar recursos a partir das dependências do npm:\n\n```vue\n\n\n\n```\n\nИмпорты через `src` следуют тем же правилам разрешения путей, что и запросы модулей webpack, что означает:\n\n- Относительные пути должны начинаться с `./`\n- Можно импортировать ресурсы из зависимостей npm:\n\n```vue\n\n\n\n```\n\nИмпорты через `src` следуют тем же правилам разрешения путей, что и запросы модулей webpack, что означает:\n\n- Относительные пути должны начинаться с `./`\n- Можно импортировать ресурсы из зависимостей npm:\n\n```vue\n\n\n```\n\nОбратите внимание, что интеграция с различными пре-процессорами может отличаться в зависимости от инструментария. Примеры можно найти в соответствующей документации:\n\n- [Vite](https://vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors#using-pre-processors)\n" + "value": "В секциях можно объявить язык пре-процессора с помощью атрибута `lang`. Наиболее распространённый случай — использование TypeScript для секции `\n```\n\nАтрибут `lang` можно применить к любой секции — например можно использовать [SASS](https://sass-lang.com/) в секции `\n```\n\nОбратите внимание, что интеграция с различными пре-процессорами может отличаться в зависимости от инструментария. Примеры можно найти в соответствующей документации:\n\n- [Vite](https://vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors#using-pre-processors)" }, "values": [ { @@ -201,7 +201,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nЕсли вы предпочитаете разделять компоненты `*.vue` на несколько файлов, вы можете использовать атрибут `src` для импорта внешнего файла для языковой секции:\n\n```vue\n\n\n\n```\n\nИмпорты через `src` следуют тем же правилам разрешения путей, что и запросы модулей webpack, что означает:\n\n- Относительные пути должны начинаться с `./`\n- Можно импортировать ресурсы из зависимостей npm:\n\n```vue\n\n\n\n```\n\nИмпорты через `src` следуют тем же правилам разрешения путей, что и запросы модулей webpack, что означает:\n\n- Относительные пути должны начинаться с `./`\n- Можно импортировать ресурсы из зависимостей npm:\n\n```vue\n\n\n```\n\nОбратите внимание, что интеграция с различными пре-процессорами может отличаться в зависимости от инструментария. Примеры можно найти в соответствующей документации:\n\n- [Vite](https://vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors#using-pre-processors)\n" + "value": "В секциях можно объявить язык пре-процессора с помощью атрибута `lang`. Наиболее распространённый случай — использование TypeScript для секции `\n```\n\nАтрибут `lang` можно применить к любой секции — например можно использовать [SASS](https://sass-lang.com/) в секции `\n```\n\nОбратите внимание, что интеграция с различными пре-процессорами может отличаться в зависимости от инструментария. Примеры можно найти в соответствующей документации:\n\n- [Vite](https://vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors#using-pre-processors)" }, "values": [ { @@ -527,7 +527,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nЕсли вы предпочитаете разделять компоненты `*.vue` на несколько файлов, вы можете использовать атрибут `src` для импорта внешнего файла для языковой секции:\n\n```vue\n\n\n\n```\n\nИмпорты через `src` следуют тем же правилам разрешения путей, что и запросы модулей webpack, что означает:\n\n- Относительные пути должны начинаться с `./`\n- Можно импортировать ресурсы из зависимостей npm:\n\n```vue\n\n\n\n```\n\nИмпорты через `src` следуют тем же правилам разрешения путей, что и запросы модулей webpack, что означает:\n\n- Относительные пути должны начинаться с `./`\n- Можно импортировать ресурсы из зависимостей npm:\n\n```vue\n\n\n```\n\nОбратите внимание, что интеграция с различными пре-процессорами может отличаться в зависимости от инструментария. Примеры можно найти в соответствующей документации:\n\n- [Vite](https://vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors#using-pre-processors)\n" + "value": "В секциях можно объявить язык пре-процессора с помощью атрибута `lang`. Наиболее распространённый случай — использование TypeScript для секции `\n```\n\nАтрибут `lang` можно применить к любой секции — например можно использовать [SASS](https://sass-lang.com/) в секции `\n```\n\nОбратите внимание, что интеграция с различными пре-процессорами может отличаться в зависимости от инструментария. Примеры можно найти в соответствующей документации:\n\n- [Vite](https://vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors#using-pre-processors)" }, "values": [ { @@ -670,7 +670,7 @@ "valueSet": "v", "description": { "kind": "markdown", - "value": "\nКогда секция `\n\n\n```\n\nВ этот код:\n\n```vue\n\n\n\n```\n\n### Корневые элементы дочернего компонента \n\nПри использовании `scoped` стили родительского компонента не будут проникать в дочерние компоненты. Однако корневой элемент дочернего компонента будет подвержен влиянию как родительского, так и дочернего CSS. Это сделано специально для того, чтобы родитель мог стилизовать корневой элемент дочернего компонента в целях вёрстки.\n\n### Глубокие селекторы \n\nЕсли требуется, чтобы селектор в `scoped` стилях был \"глубоким\", т.е. влиял на дочерние компоненты, можно использовать псевдокласс `:deep()`:\n\n```vue\n\n```\n\nКод выше будет скомпилирован в:\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip Совет\nСодержимое DOM, созданное при помощи `v-html`, не подвержено влиянию стилей c ограниченной областью действия, но его все же можно стилизовать с помощью глубоких селекторов.\n:::\n\n### Селекторы слотов \n\nПо умолчанию стили с ограниченной областью действия не влияют на содержимое, отображаемое с помощью ``, так как считается, что оно принадлежит родительскому компоненту, который его передаёт. Чтобы явно указать на содержимое слота, используйте псевдокласс `:slotted`:\n\n```vue\n\n```\n\n### Глобальные селекторы \n\nЕсли необходимо, чтобы одно правило применялось глобально, можно использовать псевдокласс `:global`, а не создавать еще одну секцию `\n```\n\n### Сочетание локальных и глобальных стилей \n\nВ одном компоненте можно вместе использовать как scoped, так и обычные секции style:\n\n```vue\n\n\n\n```\n\n### Советы по использованию стилей с ограниченной областью действия \n\n- **Стили с ограниченной областью действия не избавляют от необходимости использования классов**. Ввиду того, как браузеры отрисовывают различные CSS-селекторы, `p { color: red }` будет работать гораздо медленнее при использовании стилей с ограниченной областью действия (т.е. в сочетании с селектором атрибутов). Если вместо этого использовать классы или идентификаторы, как, например, в `.example { color: red }`, то это практически исключает снижение производительности.\n\n- **Будьте осторожны с селекторами потомков в рекурсивных компонентах!** Для правила CSS с селектором `.a .b`, если элемент, соответствующий `.a`, содержит рекурсивный дочерний компонент, то все `.b` в этом дочернем компоненте будут соответствовать правилу.\n" + "value": "Когда секция `\n\n\n```\n\nВ этот код:\n\n```vue\n\n\n\n```\n\n### Корневые элементы дочернего компонента \n\nПри использовании `scoped` стили родительского компонента не будут проникать в дочерние компоненты. Однако корневой элемент дочернего компонента будет подвержен влиянию как родительского, так и дочернего CSS. Это сделано специально для того, чтобы родитель мог стилизовать корневой элемент дочернего компонента в целях вёрстки.\n\n### Глубокие селекторы \n\nЕсли требуется, чтобы селектор в `scoped` стилях был \"глубоким\", т.е. влиял на дочерние компоненты, можно использовать псевдокласс `:deep()`:\n\n```vue\n\n```\n\nКод выше будет скомпилирован в:\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip Совет\nСодержимое DOM, созданное при помощи `v-html`, не подвержено влиянию стилей c ограниченной областью действия, но его все же можно стилизовать с помощью глубоких селекторов.\n:::\n\n### Селекторы слотов \n\nПо умолчанию стили с ограниченной областью действия не влияют на содержимое, отображаемое с помощью ``, так как считается, что оно принадлежит родительскому компоненту, который его передаёт. Чтобы явно указать на содержимое слота, используйте псевдокласс `:slotted`:\n\n```vue\n\n```\n\n### Глобальные селекторы \n\nЕсли необходимо, чтобы одно правило применялось глобально, можно использовать псевдокласс `:global`, а не создавать еще одну секцию `\n```\n\n### Сочетание локальных и глобальных стилей \n\nВ одном компоненте можно вместе использовать как scoped, так и обычные секции style:\n\n```vue\n\n\n\n```\n\n### Советы по использованию стилей с ограниченной областью действия \n\n- **Стили с ограниченной областью действия не избавляют от необходимости использования классов**. Ввиду того, как браузеры отрисовывают различные CSS-селекторы, `p { color: red }` будет работать гораздо медленнее при использовании стилей с ограниченной областью действия (т.е. в сочетании с селектором атрибутов). Если вместо этого использовать классы или идентификаторы, как, например, в `.example { color: red }`, то это практически исключает снижение производительности.\n\n- **Будьте осторожны с селекторами потомков в рекурсивных компонентах!** Для правила CSS с селектором `.a .b`, если элемент, соответствующий `.a`, содержит рекурсивный дочерний компонент, то все `.b` в этом дочернем компоненте будут соответствовать правилу." }, "references": [ { @@ -732,7 +732,7 @@ "valueSet": "v", "description": { "kind": "markdown", - "value": "\nСекция `\n```\n\nПолученные классы хэшируются во избежание коллизий, что позволяет добиться того же эффекта, что и при выборе CSS с ограниченной областью действия только для текущего компонента.\n\nОбратитесь к [спецификации CSS модулей](https://github.com/css-modules/css-modules) для получения более подробной информации, такой как [глобальные исключения](https://github.com/css-modules/css-modules/blob/master/docs/composition.md#exceptions) и [композиция](https://github.com/css-modules/css-modules/blob/master/docs/composition.md#composition).\n\n### Внедрение пользовательского имени \n\nМожно настроить ключ свойства объекта внедряемых классов, указав значение атрибуту `module`:\n\n```vue\n\n\n\n```\n\n### Использование с Composition API \n\nДоступ к внедряемым классам можно получить в `setup()` и `\n\n\n\n\n```" }, "references": [ { @@ -856,7 +856,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nЕсли вы предпочитаете разделять компоненты `*.vue` на несколько файлов, вы можете использовать атрибут `src` для импорта внешнего файла для языковой секции:\n\n```vue\n\n\n\n```\n\nИмпорты через `src` следуют тем же правилам разрешения путей, что и запросы модулей webpack, что означает:\n\n- Относительные пути должны начинаться с `./`\n- Можно импортировать ресурсы из зависимостей npm:\n\n```vue\n\n\n\n```\n\nИмпорты через `src` следуют тем же правилам разрешения путей, что и запросы модулей webpack, что означает:\n\n- Относительные пути должны начинаться с `./`\n- Можно импортировать ресурсы из зависимостей npm:\n\n```vue\n\n\n```\n\nОбратите внимание, что интеграция с различными пре-процессорами может отличаться в зависимости от инструментария. Примеры можно найти в соответствующей документации:\n\n- [Vite](https://vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors#using-pre-processors)\n" + "value": "В секциях можно объявить язык пре-процессора с помощью атрибута `lang`. Наиболее распространённый случай — использование TypeScript для секции `\n```\n\nАтрибут `lang` можно применить к любой секции — например можно использовать [SASS](https://sass-lang.com/) в секции `\n```\n\nОбратите внимание, что интеграция с различными пре-процессорами может отличаться в зависимости от инструментария. Примеры можно найти в соответствующей документации:\n\n- [Vite](https://vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors#using-pre-processors)" }, "values": [], "references": [ @@ -1041,7 +1041,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\nЕсли вы предпочитаете разделять компоненты `*.vue` на несколько файлов, вы можете использовать атрибут `src` для импорта внешнего файла для языковой секции:\n\n```vue\n\n\n\n```\n\nИмпорты через `src` следуют тем же правилам разрешения путей, что и запросы модулей webpack, что означает:\n\n- Относительные пути должны начинаться с `./`\n- Можно импортировать ресурсы из зависимостей npm:\n\n```vue\n\n\n\n```\n\nИмпорты через `src` следуют тем же правилам разрешения путей, что и запросы модулей webpack, что означает:\n\n- Относительные пути должны начинаться с `./`\n- Можно импортировать ресурсы из зависимостей npm:\n\n```vue\n\n\n\n```\n\n请注意 `src` 导入和 JS 模块导入遵循相同的路径解析规则,这意味着:\n\n- 相对路径需要以 `./` 开头\n- 你也可以从 npm 依赖中导入资源\n\n```vue\n\n\n\n```\n\n请注意 `src` 导入和 JS 模块导入遵循相同的路径解析规则,这意味着:\n\n- 相对路径需要以 `./` 开头\n- 你也可以从 npm 依赖中导入资源\n\n```vue\n\n\n```\n\n注意对不同预处理器的集成会根据你所使用的工具链而有所不同,具体细节请查看相应的工具链文档来确认:\n\n- [Vite](https://cn.vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/zh/guide/css.html#%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/zh/guide/pre-processors.html#%E4%BD%BF%E7%94%A8%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n" + "value": "代码块可以使用 `lang` 这个 attribute 来声明预处理器语言,最常见的用例就是在 `\n```\n\n`lang` 在任意块上都能使用,比如我们可以在 `\n```\n\n注意对不同预处理器的集成会根据你所使用的工具链而有所不同,具体细节请查看相应的工具链文档来确认:\n\n- [Vite](https://cn.vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/zh/guide/css.html#%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/zh/guide/pre-processors.html#%E4%BD%BF%E7%94%A8%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)" }, "values": [ { @@ -201,7 +201,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\n如果你更喜欢将 `*.vue` 组件分散到多个文件中,可以为一个语块使用 `src` 这个 attribute 来导入一个外部文件:\n\n```vue\n\n\n\n```\n\n请注意 `src` 导入和 JS 模块导入遵循相同的路径解析规则,这意味着:\n\n- 相对路径需要以 `./` 开头\n- 你也可以从 npm 依赖中导入资源\n\n```vue\n\n\n\n```\n\n请注意 `src` 导入和 JS 模块导入遵循相同的路径解析规则,这意味着:\n\n- 相对路径需要以 `./` 开头\n- 你也可以从 npm 依赖中导入资源\n\n```vue\n\n\n```\n\n注意对不同预处理器的集成会根据你所使用的工具链而有所不同,具体细节请查看相应的工具链文档来确认:\n\n- [Vite](https://cn.vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/zh/guide/css.html#%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/zh/guide/pre-processors.html#%E4%BD%BF%E7%94%A8%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n" + "value": "代码块可以使用 `lang` 这个 attribute 来声明预处理器语言,最常见的用例就是在 `\n```\n\n`lang` 在任意块上都能使用,比如我们可以在 `\n```\n\n注意对不同预处理器的集成会根据你所使用的工具链而有所不同,具体细节请查看相应的工具链文档来确认:\n\n- [Vite](https://cn.vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/zh/guide/css.html#%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/zh/guide/pre-processors.html#%E4%BD%BF%E7%94%A8%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)" }, "values": [ { @@ -527,7 +527,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\n如果你更喜欢将 `*.vue` 组件分散到多个文件中,可以为一个语块使用 `src` 这个 attribute 来导入一个外部文件:\n\n```vue\n\n\n\n```\n\n请注意 `src` 导入和 JS 模块导入遵循相同的路径解析规则,这意味着:\n\n- 相对路径需要以 `./` 开头\n- 你也可以从 npm 依赖中导入资源\n\n```vue\n\n\n\n```\n\n请注意 `src` 导入和 JS 模块导入遵循相同的路径解析规则,这意味着:\n\n- 相对路径需要以 `./` 开头\n- 你也可以从 npm 依赖中导入资源\n\n```vue\n\n\n```\n\n注意对不同预处理器的集成会根据你所使用的工具链而有所不同,具体细节请查看相应的工具链文档来确认:\n\n- [Vite](https://cn.vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/zh/guide/css.html#%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/zh/guide/pre-processors.html#%E4%BD%BF%E7%94%A8%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n" + "value": "代码块可以使用 `lang` 这个 attribute 来声明预处理器语言,最常见的用例就是在 `\n```\n\n`lang` 在任意块上都能使用,比如我们可以在 `\n```\n\n注意对不同预处理器的集成会根据你所使用的工具链而有所不同,具体细节请查看相应的工具链文档来确认:\n\n- [Vite](https://cn.vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/zh/guide/css.html#%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/zh/guide/pre-processors.html#%E4%BD%BF%E7%94%A8%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)" }, "values": [ { @@ -670,7 +670,7 @@ "valueSet": "v", "description": { "kind": "markdown", - "value": "\n当 `\n\n\n```\n\n转换为:\n\n```vue\n\n\n\n```\n\n### 子组件的根元素 \n\n使用 `scoped` 后,父组件的样式将不会渗透到子组件中。不过,子组件的根节点会同时被父组件的作用域样式和子组件的作用域样式影响。这样设计是为了让父组件可以从布局的角度出发,调整其子组件根元素的样式。\n\n### 深度选择器 \n\n处于 `scoped` 样式中的选择器如果想要做更“深度”的选择,也即:影响到子组件,可以使用 `:deep()` 这个伪类:\n\n```vue\n\n```\n\n上面的代码会被编译成:\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip\n通过 `v-html` 创建的 DOM 内容不会被作用域样式影响,但你仍然可以使用深度选择器来设置其样式。\n:::\n\n### 插槽选择器 \n\n默认情况下,作用域样式不会影响到 `` 渲染出来的内容,因为它们被认为是父组件所持有并传递进来的。使用 `:slotted` 伪类以明确地将插槽内容作为选择器的目标:\n\n```vue\n\n```\n\n### 全局选择器 \n\n如果想让其中一个样式规则应用到全局,比起另外创建一个 `\n```\n\n### 混合使用局部与全局样式 \n\n你也可以在同一个组件中同时包含作用域样式和非作用域样式:\n\n```vue\n\n\n\n```\n\n### 作用域样式须知 \n\n- **作用域样式并没有消除对 class 的需求**。由于浏览器渲染各种各样 CSS 选择器的方式,`p { color: red }` 结合作用域样式使用时 (即当与 attribute 选择器组合的时候) 会慢很多倍。如果你使用 class 或者 id 来替代,例如 `.example { color: red }`,那你几乎就可以避免性能的损失。\n\n- **小心递归组件中的后代选择器**!对于一个使用了 `.a .b` 选择器的样式规则来说,如果匹配到 `.a` 的元素包含了一个递归的子组件,那么所有的在那个子组件中的 `.b` 都会匹配到这条样式规则。\n" + "value": "当 `\n\n\n```\n\n转换为:\n\n```vue\n\n\n\n```\n\n### 子组件的根元素 \n\n使用 `scoped` 后,父组件的样式将不会渗透到子组件中。不过,子组件的根节点会同时被父组件的作用域样式和子组件的作用域样式影响。这样设计是为了让父组件可以从布局的角度出发,调整其子组件根元素的样式。\n\n### 深度选择器 \n\n处于 `scoped` 样式中的选择器如果想要做更“深度”的选择,也即:影响到子组件,可以使用 `:deep()` 这个伪类:\n\n```vue\n\n```\n\n上面的代码会被编译成:\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip\n通过 `v-html` 创建的 DOM 内容不会被作用域样式影响,但你仍然可以使用深度选择器来设置其样式。\n:::\n\n### 插槽选择器 \n\n默认情况下,作用域样式不会影响到 `` 渲染出来的内容,因为它们被认为是父组件所持有并传递进来的。使用 `:slotted` 伪类以明确地将插槽内容作为选择器的目标:\n\n```vue\n\n```\n\n### 全局选择器 \n\n如果想让其中一个样式规则应用到全局,比起另外创建一个 `\n```\n\n### 混合使用局部与全局样式 \n\n你也可以在同一个组件中同时包含作用域样式和非作用域样式:\n\n```vue\n\n\n\n```\n\n### 作用域样式须知 \n\n- **作用域样式并没有消除对 class 的需求**。由于浏览器渲染各种各样 CSS 选择器的方式,`p { color: red }` 结合作用域样式使用时 (即当与 attribute 选择器组合的时候) 会慢很多倍。如果你使用 class 或者 id 来替代,例如 `.example { color: red }`,那你几乎就可以避免性能的损失。\n\n- **小心递归组件中的后代选择器**!对于一个使用了 `.a .b` 选择器的样式规则来说,如果匹配到 `.a` 的元素包含了一个递归的子组件,那么所有的在那个子组件中的 `.b` 都会匹配到这条样式规则。" }, "references": [ { @@ -732,7 +732,7 @@ "valueSet": "v", "description": { "kind": "markdown", - "value": "\n一个 `\n```\n\n得出的 class 将被哈希化以避免冲突,实现了同样的将 CSS 仅作用于当前组件的效果。\n\n参考 [CSS Modules spec](https://github.com/css-modules/css-modules) 以查看更多详情,例如 [global exceptions](https://github.com/css-modules/css-modules/blob/master/docs/composition.md#exceptions) 和 [composition](https://github.com/css-modules/css-modules/blob/master/docs/composition.md#composition)。\n\n### 自定义注入名称 \n\n你可以通过给 `module` attribute 一个值来自定义注入 class 对象的属性名:\n\n```vue\n\n\n\n```\n\n### 与组合式 API 一同使用 \n\n可以通过 `useCssModule` API 在 `setup()` 和 `\n```\n\n请注意 `src` 导入和 JS 模块导入遵循相同的路径解析规则,这意味着:\n\n- 相对路径需要以 `./` 开头\n- 你也可以从 npm 依赖中导入资源\n\n```vue\n\n\n\n```\n\n请注意 `src` 导入和 JS 模块导入遵循相同的路径解析规则,这意味着:\n\n- 相对路径需要以 `./` 开头\n- 你也可以从 npm 依赖中导入资源\n\n```vue\n\n\n```\n\n注意对不同预处理器的集成会根据你所使用的工具链而有所不同,具体细节请查看相应的工具链文档来确认:\n\n- [Vite](https://cn.vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/zh/guide/css.html#%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/zh/guide/pre-processors.html#%E4%BD%BF%E7%94%A8%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n" + "value": "代码块可以使用 `lang` 这个 attribute 来声明预处理器语言,最常见的用例就是在 `\n```\n\n`lang` 在任意块上都能使用,比如我们可以在 `\n```\n\n注意对不同预处理器的集成会根据你所使用的工具链而有所不同,具体细节请查看相应的工具链文档来确认:\n\n- [Vite](https://cn.vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/zh/guide/css.html#%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/zh/guide/pre-processors.html#%E4%BD%BF%E7%94%A8%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)" }, "values": [], "references": [ @@ -1041,7 +1041,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\n如果你更喜欢将 `*.vue` 组件分散到多个文件中,可以为一个语块使用 `src` 这个 attribute 来导入一个外部文件:\n\n```vue\n\n\n\n```\n\n请注意 `src` 导入和 JS 模块导入遵循相同的路径解析规则,这意味着:\n\n- 相对路径需要以 `./` 开头\n- 你也可以从 npm 依赖中导入资源\n\n```vue\n\n\n\n```\n\n请注意 `src` 导入和 JS 模块导入遵循相同的路径解析规则,这意味着:\n\n- 相对路径需要以 `./` 开头\n- 你也可以从 npm 依赖中导入资源\n\n```vue\n\n\n\n```\n\n请注意 `src` 导入和 JS 模块导入遵循相同的路径解析规则,这意味着:\n\n- 相对路径需要以 `./` 开头\n- 你也可以从 npm 依赖中导入资源\n\n```vue\n\n\n\n```\n\n请注意 `src` 导入和 JS 模块导入遵循相同的路径解析规则,这意味着:\n\n- 相对路径需要以 `./` 开头\n- 你也可以从 npm 依赖中导入资源\n\n```vue\n\n\n```\n\n注意对不同预处理器的集成会根据你所使用的工具链而有所不同,具体细节请查看相应的工具链文档来确认:\n\n- [Vite](https://cn.vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/zh/guide/css.html#%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/zh/guide/pre-processors.html#%E4%BD%BF%E7%94%A8%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n" + "value": "代码块可以使用 `lang` 这个 attribute 来声明预处理器语言,最常见的用例就是在 `\n```\n\n`lang` 在任意块上都能使用,比如我们可以在 `\n```\n\n注意对不同预处理器的集成会根据你所使用的工具链而有所不同,具体细节请查看相应的工具链文档来确认:\n\n- [Vite](https://cn.vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/zh/guide/css.html#%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/zh/guide/pre-processors.html#%E4%BD%BF%E7%94%A8%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)" }, "values": [ { @@ -201,7 +201,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\n如果你更喜欢将 `*.vue` 组件分散到多个文件中,可以为一个语块使用 `src` 这个 attribute 来导入一个外部文件:\n\n```vue\n\n\n\n```\n\n请注意 `src` 导入和 JS 模块导入遵循相同的路径解析规则,这意味着:\n\n- 相对路径需要以 `./` 开头\n- 你也可以从 npm 依赖中导入资源\n\n```vue\n\n\n\n```\n\n请注意 `src` 导入和 JS 模块导入遵循相同的路径解析规则,这意味着:\n\n- 相对路径需要以 `./` 开头\n- 你也可以从 npm 依赖中导入资源\n\n```vue\n\n\n```\n\n注意对不同预处理器的集成会根据你所使用的工具链而有所不同,具体细节请查看相应的工具链文档来确认:\n\n- [Vite](https://cn.vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/zh/guide/css.html#%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/zh/guide/pre-processors.html#%E4%BD%BF%E7%94%A8%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n" + "value": "代码块可以使用 `lang` 这个 attribute 来声明预处理器语言,最常见的用例就是在 `\n```\n\n`lang` 在任意块上都能使用,比如我们可以在 `\n```\n\n注意对不同预处理器的集成会根据你所使用的工具链而有所不同,具体细节请查看相应的工具链文档来确认:\n\n- [Vite](https://cn.vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/zh/guide/css.html#%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/zh/guide/pre-processors.html#%E4%BD%BF%E7%94%A8%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)" }, "values": [ { @@ -527,7 +527,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\n如果你更喜欢将 `*.vue` 组件分散到多个文件中,可以为一个语块使用 `src` 这个 attribute 来导入一个外部文件:\n\n```vue\n\n\n\n```\n\n请注意 `src` 导入和 JS 模块导入遵循相同的路径解析规则,这意味着:\n\n- 相对路径需要以 `./` 开头\n- 你也可以从 npm 依赖中导入资源\n\n```vue\n\n\n\n```\n\n请注意 `src` 导入和 JS 模块导入遵循相同的路径解析规则,这意味着:\n\n- 相对路径需要以 `./` 开头\n- 你也可以从 npm 依赖中导入资源\n\n```vue\n\n\n```\n\n注意对不同预处理器的集成会根据你所使用的工具链而有所不同,具体细节请查看相应的工具链文档来确认:\n\n- [Vite](https://cn.vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/zh/guide/css.html#%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/zh/guide/pre-processors.html#%E4%BD%BF%E7%94%A8%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n" + "value": "代码块可以使用 `lang` 这个 attribute 来声明预处理器语言,最常见的用例就是在 `\n```\n\n`lang` 在任意块上都能使用,比如我们可以在 `\n```\n\n注意对不同预处理器的集成会根据你所使用的工具链而有所不同,具体细节请查看相应的工具链文档来确认:\n\n- [Vite](https://cn.vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/zh/guide/css.html#%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/zh/guide/pre-processors.html#%E4%BD%BF%E7%94%A8%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)" }, "values": [ { @@ -670,7 +670,7 @@ "valueSet": "v", "description": { "kind": "markdown", - "value": "\n当 `\n\n\n```\n\n转换为:\n\n```vue\n\n\n\n```\n\n### 子组件的根元素 \n\n使用 `scoped` 后,父组件的样式将不会渗透到子组件中。不过,子组件的根节点会同时被父组件的作用域样式和子组件的作用域样式影响。这样设计是为了让父组件可以从布局的角度出发,调整其子组件根元素的样式。\n\n### 深度选择器 \n\n处于 `scoped` 样式中的选择器如果想要做更“深度”的选择,也即:影响到子组件,可以使用 `:deep()` 这个伪类:\n\n```vue\n\n```\n\n上面的代码会被编译成:\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip\n通过 `v-html` 创建的 DOM 内容不会被作用域样式影响,但你仍然可以使用深度选择器来设置其样式。\n:::\n\n### 插槽选择器 \n\n默认情况下,作用域样式不会影响到 `` 渲染出来的内容,因为它们被认为是父组件所持有并传递进来的。使用 `:slotted` 伪类以明确地将插槽内容作为选择器的目标:\n\n```vue\n\n```\n\n### 全局选择器 \n\n如果想让其中一个样式规则应用到全局,比起另外创建一个 `\n```\n\n### 混合使用局部与全局样式 \n\n你也可以在同一个组件中同时包含作用域样式和非作用域样式:\n\n```vue\n\n\n\n```\n\n### 作用域样式须知 \n\n- **作用域样式并没有消除对 class 的需求**。由于浏览器渲染各种各样 CSS 选择器的方式,`p { color: red }` 结合作用域样式使用时 (即当与 attribute 选择器组合的时候) 会慢很多倍。如果你使用 class 或者 id 来替代,例如 `.example { color: red }`,那你几乎就可以避免性能的损失。\n\n- **小心递归组件中的后代选择器**!对于一个使用了 `.a .b` 选择器的样式规则来说,如果匹配到 `.a` 的元素包含了一个递归的子组件,那么所有的在那个子组件中的 `.b` 都会匹配到这条样式规则。\n" + "value": "当 `\n\n\n```\n\n转换为:\n\n```vue\n\n\n\n```\n\n### 子组件的根元素 \n\n使用 `scoped` 后,父组件的样式将不会渗透到子组件中。不过,子组件的根节点会同时被父组件的作用域样式和子组件的作用域样式影响。这样设计是为了让父组件可以从布局的角度出发,调整其子组件根元素的样式。\n\n### 深度选择器 \n\n处于 `scoped` 样式中的选择器如果想要做更“深度”的选择,也即:影响到子组件,可以使用 `:deep()` 这个伪类:\n\n```vue\n\n```\n\n上面的代码会被编译成:\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip\n通过 `v-html` 创建的 DOM 内容不会被作用域样式影响,但你仍然可以使用深度选择器来设置其样式。\n:::\n\n### 插槽选择器 \n\n默认情况下,作用域样式不会影响到 `` 渲染出来的内容,因为它们被认为是父组件所持有并传递进来的。使用 `:slotted` 伪类以明确地将插槽内容作为选择器的目标:\n\n```vue\n\n```\n\n### 全局选择器 \n\n如果想让其中一个样式规则应用到全局,比起另外创建一个 `\n```\n\n### 混合使用局部与全局样式 \n\n你也可以在同一个组件中同时包含作用域样式和非作用域样式:\n\n```vue\n\n\n\n```\n\n### 作用域样式须知 \n\n- **作用域样式并没有消除对 class 的需求**。由于浏览器渲染各种各样 CSS 选择器的方式,`p { color: red }` 结合作用域样式使用时 (即当与 attribute 选择器组合的时候) 会慢很多倍。如果你使用 class 或者 id 来替代,例如 `.example { color: red }`,那你几乎就可以避免性能的损失。\n\n- **小心递归组件中的后代选择器**!对于一个使用了 `.a .b` 选择器的样式规则来说,如果匹配到 `.a` 的元素包含了一个递归的子组件,那么所有的在那个子组件中的 `.b` 都会匹配到这条样式规则。" }, "references": [ { @@ -732,7 +732,7 @@ "valueSet": "v", "description": { "kind": "markdown", - "value": "\n一个 `\n```\n\n得出的 class 将被哈希化以避免冲突,实现了同样的将 CSS 仅作用于当前组件的效果。\n\n参考 [CSS Modules spec](https://github.com/css-modules/css-modules) 以查看更多详情,例如 [global exceptions](https://github.com/css-modules/css-modules/blob/master/docs/composition.md#exceptions) 和 [composition](https://github.com/css-modules/css-modules/blob/master/docs/composition.md#composition)。\n\n### 自定义注入名称 \n\n你可以通过给 `module` attribute 一个值来自定义注入 class 对象的属性名:\n\n```vue\n\n\n\n```\n\n### 与组合式 API 一同使用 \n\n可以通过 `useCssModule` API 在 `setup()` 和 `\n```\n\n请注意 `src` 导入和 JS 模块导入遵循相同的路径解析规则,这意味着:\n\n- 相对路径需要以 `./` 开头\n- 你也可以从 npm 依赖中导入资源\n\n```vue\n\n\n\n```\n\n请注意 `src` 导入和 JS 模块导入遵循相同的路径解析规则,这意味着:\n\n- 相对路径需要以 `./` 开头\n- 你也可以从 npm 依赖中导入资源\n\n```vue\n\n\n```\n\n注意对不同预处理器的集成会根据你所使用的工具链而有所不同,具体细节请查看相应的工具链文档来确认:\n\n- [Vite](https://cn.vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/zh/guide/css.html#%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/zh/guide/pre-processors.html#%E4%BD%BF%E7%94%A8%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n" + "value": "代码块可以使用 `lang` 这个 attribute 来声明预处理器语言,最常见的用例就是在 `\n```\n\n`lang` 在任意块上都能使用,比如我们可以在 `\n```\n\n注意对不同预处理器的集成会根据你所使用的工具链而有所不同,具体细节请查看相应的工具链文档来确认:\n\n- [Vite](https://cn.vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/zh/guide/css.html#%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/zh/guide/pre-processors.html#%E4%BD%BF%E7%94%A8%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8)" }, "values": [], "references": [ @@ -1041,7 +1041,7 @@ "name": "src", "description": { "kind": "markdown", - "value": "\n如果你更喜欢将 `*.vue` 组件分散到多个文件中,可以为一个语块使用 `src` 这个 attribute 来导入一个外部文件:\n\n```vue\n\n\n\n```\n\n请注意 `src` 导入和 JS 模块导入遵循相同的路径解析规则,这意味着:\n\n- 相对路径需要以 `./` 开头\n- 你也可以从 npm 依赖中导入资源\n\n```vue\n\n\n\n```\n\n请注意 `src` 导入和 JS 模块导入遵循相同的路径解析规则,这意味着:\n\n- 相对路径需要以 `./` 开头\n- 你也可以从 npm 依赖中导入资源\n\n```vue\n\n\n\n```\n\nPozor na to, že pro importy pomocí `src` platí stejná pravidla pro zadávání cest jako pro požadavky na webpack moduly, což znamená:\n\n- Relativní cesty musí začínat s `./`\n- Můžete importovat zdroje z npm závislostí:\n\n```vue\n\n\n```\n\nDejte pozor, že integrace s různými pre-procesory se může lišit podle zvolené sady softwarových nástrojů. Pro příklady se podívejte do příslušné dokumentace:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" + "value": "Bloky mohou pomocí atributu `lang` deklarovat programovací jazyk, v němž má proběhnout pre-processing. Nejběžnější případ je použití TypeScriptu pro blok `\n```\n\n`lang` lze použít na jakýkoli blok – například můžeme použít `\n```\n\nDejte pozor, že integrace s různými pre-procesory se může lišit podle zvolené sady softwarových nástrojů. Pro příklady se podívejte do příslušné dokumentace:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)" }, "values": [ { @@ -79,120 +26,14 @@ "name": "pug" } ], - "references": [ - { - "name": "en", - "url": "https://vuejs.org/api/sfc-spec.html#pre-processors" - }, - { - "name": "zh-cn", - "url": "https://cn.vuejs.org/api/sfc-spec.html#pre-processors" - }, - { - "name": "zh-hk", - "url": "https://zh-hk.vuejs.org/api/sfc-spec.html#pre-processors" - }, - { - "name": "ja", - "url": "https://ja.vuejs.org/api/sfc-spec.html#pre-processors" - }, - { - "name": "ua", - "url": "https://ua.vuejs.org/api/sfc-spec.html#pre-processors" - }, - { - "name": "fr", - "url": "https://fr.vuejs.org/api/sfc-spec.html#pre-processors" - }, - { - "name": "ko", - "url": "https://ko.vuejs.org/api/sfc-spec.html#pre-processors" - }, - { - "name": "pt", - "url": "https://pt.vuejs.org/api/sfc-spec.html#pre-processors" - }, - { - "name": "bn", - "url": "https://bn.vuejs.org/api/sfc-spec.html#pre-processors" - }, - { - "name": "it", - "url": "https://it.vuejs.org/api/sfc-spec.html#pre-processors" - }, - { - "name": "cs", - "url": "https://cs.vuejs.org/api/sfc-spec.html#pre-processors" - }, - { - "name": "ru", - "url": "https://ru.vuejs.org/api/sfc-spec.html#pre-processors" - }, - { - "name": "fa", - "url": "https://fa.vuejs.org/api/sfc-spec.html#pre-processors" - } - ] + "references": "api/sfc-spec.html#pre-processors" } ], "description": { "kind": "markdown", "value": "\n- Každý soubor `*.vue` může obsahovat maximálně jeden blok ` From 5c33b8f7bae72818885a02c6db26d5c9436c2588 Mon Sep 17 00:00:00 2001 From: KazariEX <1364035137@qq.com> Date: Mon, 24 Feb 2025 22:14:34 +0800 Subject: [PATCH 210/345] ci: auto close issues with `can't reproduce` label --- .../close-cannot-repoduce-issues.yml | 21 +++++++++++++++++++ 1 file changed, 21 insertions(+) create mode 100644 .github/workflows/close-cannot-repoduce-issues.yml diff --git a/.github/workflows/close-cannot-repoduce-issues.yml b/.github/workflows/close-cannot-repoduce-issues.yml new file mode 100644 index 0000000000..c6e3a1eef3 --- /dev/null +++ b/.github/workflows/close-cannot-repoduce-issues.yml @@ -0,0 +1,21 @@ +name: Auto close issues with "can't reproduce" label + +on: + schedule: + - cron: '0 0 * * *' + +permissions: + issues: write + +jobs: + close-issues: + if: github.repository == 'vuejs/language-tools' + runs-on: ubuntu-latest + steps: + - name: can't reproduce + uses: actions-cool/issues-helper@v3 + with: + actions: close-issues + token: ${{ secrets.GITHUB_TOKEN }} + labels: "can't reproduce" + inactive-day: 3 From 810123c5c868929d4ca662e660940556a898c79d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=B1=B1=E5=90=B9=E8=89=B2=E5=BE=A1=E5=AE=88?= <85992002+KazariEX@users.noreply.github.com> Date: Tue, 25 Feb 2025 00:50:38 +0800 Subject: [PATCH 211/345] fix(component-meta): resolve `defineModel` options to collect `default` value (#5209) --- packages/component-meta/lib/base.ts | 50 ++++++++++++++++--- packages/component-meta/tests/index.spec.ts | 46 ++++++++++++++--- .../lib/parsers/scriptSetupRanges.ts | 8 ++- .../tsc/tests/__snapshots__/dts.spec.ts.snap | 25 ++++++---- .../reference-type-model/component.vue | 11 ++-- 5 files changed, 109 insertions(+), 31 deletions(-) diff --git a/packages/component-meta/lib/base.ts b/packages/component-meta/lib/base.ts index a944fd7a03..84cb362c91 100644 --- a/packages/component-meta/lib/base.ts +++ b/packages/component-meta/lib/base.ts @@ -416,7 +416,7 @@ ${commandLine.vueOptions.target < 3 ? vue2TypeHelpersCode : typeHelpersCode} const type = typeChecker.getTypeOfSymbolAtLocation($exposed, symbolNode); const properties = type.getProperties().filter(prop => // only exposed props will not have a valueDeclaration - !(prop as any).valueDeclaration + !prop.valueDeclaration ); return properties.map(prop => { @@ -728,10 +728,10 @@ function readVueComponentDefaultProps( function scriptSetupWorker() { - const ast = sfc.scriptSetup?.ast; - if (!ast) { + if (!sfc.scriptSetup) { return; } + const { ast } = sfc.scriptSetup; const codegen = vue.tsCodegen.get(sfc); const scriptSetupRanges = codegen?.getScriptSetupRanges(); @@ -762,10 +762,22 @@ function readVueComponentDefaultProps( } } else if (scriptSetupRanges?.defineProps?.destructured) { - for (const [prop, initializer] of scriptSetupRanges.defineProps.destructured) { + for (const [name, initializer] of scriptSetupRanges.defineProps.destructured) { if (initializer) { const expText = printer?.printNode(ts.EmitHint.Expression, initializer, ast) ?? initializer.getText(ast); - result[prop] = { default: expText }; + result[name] = { + default: expText + }; + } + } + } + + if (scriptSetupRanges?.defineProp) { + for (const defineProp of scriptSetupRanges.defineProp) { + const obj = defineProp.argNode ? findObjectLiteralExpression(defineProp.argNode) : undefined; + if (obj) { + const name = defineProp.name ? sfc.scriptSetup.content.slice(defineProp.name.start, defineProp.name.end).slice(1, -1) : 'modelValue'; + result[name] = resolveModelOption(ast, obj, printer, ts); } } } @@ -786,10 +798,10 @@ function readVueComponentDefaultProps( function scriptWorker() { - const ast = sfc.script?.ast; - if (!ast) { + if (!sfc.script) { return; } + const { ast } = sfc.script; const scriptResult = readTsComponentDefaultProps(ast, 'default', printer, ts); for (const [key, value] of Object.entries(scriptResult)) { @@ -899,7 +911,7 @@ function resolvePropsOption( result[name].required = exp === 'true'; } if (defaultProp) { - const expNode = resolveDefaultOptionExpression((defaultProp as any).initializer, ts); + const expNode = resolveDefaultOptionExpression(defaultProp.initializer, ts); const expText = printer?.printNode(ts.EmitHint.Expression, expNode, ast) ?? expNode.getText(ast); result[name].default = expText; } @@ -910,6 +922,28 @@ function resolvePropsOption( return result; } +function resolveModelOption( + ast: ts.SourceFile, + options: ts.ObjectLiteralExpression, + printer: ts.Printer | undefined, + ts: typeof import('typescript') +) { + const result: { default?: string } = {}; + + for (const prop of options.properties) { + if (ts.isPropertyAssignment(prop)) { + const name = prop.name.getText(ast); + if (name === 'default') { + const expNode = resolveDefaultOptionExpression(prop.initializer, ts); + const expText = printer?.printNode(ts.EmitHint.Expression, expNode, ast) ?? expNode.getText(ast); + result.default = expText; + } + } + } + + return result; +} + function resolveDefaultOptionExpression( _default: ts.Expression, ts: typeof import('typescript') diff --git a/packages/component-meta/tests/index.spec.ts b/packages/component-meta/tests/index.spec.ts index 2c08b08a74..5cc13e96e8 100644 --- a/packages/component-meta/tests/index.spec.ts +++ b/packages/component-meta/tests/index.spec.ts @@ -25,23 +25,55 @@ const worker = (checker: ComponentMetaChecker, withTsconfig: boolean) => describ // expect(meta.type).toEqual(TypeMeta.Class); + const modelValue = meta.props.find(prop => prop.name === 'modelValue'); + const onUpdateModelValue = meta.events.find(event => event.name === 'update:modelValue'); + const foo = meta.props.find(prop => prop.name === 'foo'); const onUpdateFoo = meta.events.find(event => event.name === 'update:foo'); const bar = meta.props.find(prop => prop.name === 'bar'); const onUpdateBar = meta.events.find(event => event.name === 'update:bar'); - const qux = meta.props.find(prop => prop.name === 'qux'); - const quxModifiers = meta.props.find(prop => prop.name === 'quxModifiers'); - const onUpdateQux = meta.events.find(event => event.name === 'update:qux'); + const baz = meta.props.find(prop => prop.name === 'baz'); + const bazModifiers = meta.props.find(prop => prop.name === 'bazModifiers'); + const onUpdateBaz = meta.events.find(event => event.name === 'update:baz'); + + expect(modelValue).toBeDefined(); + expect(modelValue?.default).toBeUndefined(); + expect(modelValue?.required).toBeFalsy(); + expect(modelValue?.type).toEqual('number | undefined'); + expect(modelValue?.schema).toEqual({ + kind: 'enum', + type: 'number | undefined', + schema: ['undefined', 'number'], + }); + expect(onUpdateModelValue).toBeDefined(); expect(foo).toBeDefined(); - expect(bar).toBeDefined(); - expect(qux).toBeDefined(); - expect(quxModifiers).toBeDefined(); + expect(foo?.default).toBeUndefined(); + expect(foo?.required).toBeTruthy(); + expect(foo?.type).toEqual('string[]'); + expect(foo?.schema).toEqual({ + kind: 'array', + type: 'string[]', + schema: ['string'], + }); expect(onUpdateFoo).toBeDefined(); + + expect(bar).toBeDefined(); + expect(bar?.default).toBe('false'); + expect(bar?.required).toBeFalsy(); + expect(bar?.type).toEqual('boolean | undefined'); + expect(bar?.schema).toEqual({ + kind: 'enum', + type: 'boolean | undefined', + schema: ['undefined', 'false', 'true'], + }); expect(onUpdateBar).toBeDefined(); - expect(onUpdateQux).toBeDefined(); + + expect(baz).toBeDefined(); + expect(bazModifiers).toBeDefined(); + expect(onUpdateBaz).toBeDefined(); }); test('reference-type-props', () => { diff --git a/packages/language-core/lib/parsers/scriptSetupRanges.ts b/packages/language-core/lib/parsers/scriptSetupRanges.ts index 8343b42fdc..3ba598828f 100644 --- a/packages/language-core/lib/parsers/scriptSetupRanges.ts +++ b/packages/language-core/lib/parsers/scriptSetupRanges.ts @@ -20,6 +20,8 @@ type DefineProp = { defaultValue?: TextRange; required?: boolean; isModel?: boolean; + // used by component-meta + argNode?: ts.Expression; }; type DefineProps = CallExpressionRange & { @@ -153,7 +155,7 @@ export function parseScriptSetupRanges( if (vueCompilerOptions.macros.defineModel.includes(callText)) { let localName: TextRange | undefined; let propName: TextRange | undefined; - let options: ts.Node | undefined; + let options: ts.Expression | undefined; if ( ts.isVariableDeclaration(parent) && @@ -204,12 +206,13 @@ export function parseScriptSetupRanges( defaultValue, required, isModel: true, + argNode: options, }); } else if (callText === 'defineProp') { let localName: TextRange | undefined; let propName: TextRange | undefined; - let options: ts.Node | undefined; + let options: ts.Expression | undefined; if ( ts.isVariableDeclaration(parent) && @@ -280,6 +283,7 @@ export function parseScriptSetupRanges( runtimeType, defaultValue, required, + argNode: options, }); } else if (vueCompilerOptions.macros.defineProps.includes(callText)) { diff --git a/packages/tsc/tests/__snapshots__/dts.spec.ts.snap b/packages/tsc/tests/__snapshots__/dts.spec.ts.snap index 3c78e2f8d4..5e205b9e98 100644 --- a/packages/tsc/tests/__snapshots__/dts.spec.ts.snap +++ b/packages/tsc/tests/__snapshots__/dts.spec.ts.snap @@ -299,20 +299,23 @@ export default _default; exports[`vue-tsc-dts > Input: reference-type-model/component.vue, Output: reference-type-model/component.vue.d.ts 1`] = ` "type __VLS_PublicProps = { - "foo"?: number; - "bar"?: string[]; - "qux"?: string; - 'quxModifiers'?: Partial>; + modelValue?: number; + 'foo': string[]; + 'bar'?: boolean; + 'baz'?: string; + 'bazModifiers'?: Partial>; }; declare const _default: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, { - "update:foo": (value: number) => any; - "update:bar": (value: string[]) => any; - "update:qux": (value: string) => any; + "update:modelValue": (value: number) => any; + "update:foo": (value: string[]) => any; + "update:bar": (value: boolean) => any; + "update:baz": (value: string) => any; }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{ - "onUpdate:foo"?: (value: number) => any; - "onUpdate:bar"?: (value: string[]) => any; - "onUpdate:qux"?: (value: string) => any; -}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>; + "onUpdate:modelValue"?: (value: number) => any; + "onUpdate:foo"?: (value: string[]) => any; + "onUpdate:bar"?: (value: boolean) => any; + "onUpdate:baz"?: (value: string) => any; +}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>; export default _default; " `; diff --git a/test-workspace/component-meta/reference-type-model/component.vue b/test-workspace/component-meta/reference-type-model/component.vue index a295842737..4b48a5abdc 100644 --- a/test-workspace/component-meta/reference-type-model/component.vue +++ b/test-workspace/component-meta/reference-type-model/component.vue @@ -1,5 +1,10 @@ From ff6caf1d4048c13033aef965cee843b6748ad0fa Mon Sep 17 00:00:00 2001 From: github-actions <41898282+github-actions[bot]@users.noreply.github.com> Date: Mon, 24 Feb 2025 16:51:11 +0000 Subject: [PATCH 212/345] ci(lint): auto-fix --- packages/component-meta/lib/base.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/component-meta/lib/base.ts b/packages/component-meta/lib/base.ts index 84cb362c91..98fdf489dc 100644 --- a/packages/component-meta/lib/base.ts +++ b/packages/component-meta/lib/base.ts @@ -928,7 +928,7 @@ function resolveModelOption( printer: ts.Printer | undefined, ts: typeof import('typescript') ) { - const result: { default?: string } = {}; + const result: { default?: string; } = {}; for (const prop of options.properties) { if (ts.isPropertyAssignment(prop)) { From 07a8fcecf11673c29eca172b56510dfaba74f3e6 Mon Sep 17 00:00:00 2001 From: KazariEX <1364035137@qq.com> Date: Tue, 25 Feb 2025 16:20:52 +0800 Subject: [PATCH 213/345] fix(language-core): avoid duplicate generation of `defineExpose`'s codes --- .../lib/codegen/script/scriptSetup.ts | 16 +++++++++++----- 1 file changed, 11 insertions(+), 5 deletions(-) diff --git a/packages/language-core/lib/codegen/script/scriptSetup.ts b/packages/language-core/lib/codegen/script/scriptSetup.ts index f21f944047..bce22ccb08 100644 --- a/packages/language-core/lib/codegen/script/scriptSetup.ts +++ b/packages/language-core/lib/codegen/script/scriptSetup.ts @@ -145,22 +145,30 @@ function* generateSetupFunction( setupCodeModifies.push([ [ `let __VLS_exposed!: `, - generateSfcBlockSection(scriptSetup, typeArg.start, typeArg.end, codeFeatures.navigation), + generateSfcBlockSection(scriptSetup, typeArg.start, typeArg.end, codeFeatures.all), `${endOfLine}`, ], callExp.start, callExp.start, + ], [ + [`typeof __VLS_exposed`], + typeArg.start, + typeArg.end, ]); } else if (arg) { setupCodeModifies.push([ [ `const __VLS_exposed = `, - generateSfcBlockSection(scriptSetup, arg.start, arg.end, codeFeatures.navigation), + generateSfcBlockSection(scriptSetup, arg.start, arg.end, codeFeatures.all), `${endOfLine}`, ], callExp.start, callExp.start, + ], [ + [`__VLS_exposed`], + arg.start, + arg.end, ]); } else { @@ -273,9 +281,7 @@ function* generateSetupFunction( let nextStart = Math.max(scriptSetupRanges.importSectionEndOffset, scriptSetupRanges.leadingCommentEndOffset); for (const [codes, start, end] of setupCodeModifies) { yield generateSfcBlockSection(scriptSetup, nextStart, start, codeFeatures.all); - for (const code of codes) { - yield code; - } + yield* codes; nextStart = end; } yield generateSfcBlockSection(scriptSetup, nextStart, scriptSetup.content.length, codeFeatures.all); From 6bd7c0355870e50578eda27896f8fbab05916ba9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=B1=B1=E5=90=B9=E8=89=B2=E5=BE=A1=E5=AE=88?= <85992002+KazariEX@users.noreply.github.com> Date: Tue, 25 Feb 2025 19:08:48 +0800 Subject: [PATCH 214/345] feat(language-core): infer prop JSDoc from `defineModel`'s leading comments (#5211) --- packages/component-meta/tests/index.spec.ts | 46 ++++++++----------- .../lib/codegen/script/scriptSetup.ts | 13 ++++++ .../lib/codegen/template/elementProps.ts | 2 +- .../lib/parsers/scriptSetupRanges.ts | 24 ++++++++++ .../tsc/tests/__snapshots__/dts.spec.ts.snap | 28 ++++++----- .../reference-type-model/component.vue | 16 +++++-- 6 files changed, 87 insertions(+), 42 deletions(-) diff --git a/packages/component-meta/tests/index.spec.ts b/packages/component-meta/tests/index.spec.ts index 5cc13e96e8..acf31f7d35 100644 --- a/packages/component-meta/tests/index.spec.ts +++ b/packages/component-meta/tests/index.spec.ts @@ -32,47 +32,41 @@ const worker = (checker: ComponentMetaChecker, withTsconfig: boolean) => describ const onUpdateFoo = meta.events.find(event => event.name === 'update:foo'); const bar = meta.props.find(prop => prop.name === 'bar'); - const onUpdateBar = meta.events.find(event => event.name === 'update:bar'); - - const baz = meta.props.find(prop => prop.name === 'baz'); - const bazModifiers = meta.props.find(prop => prop.name === 'bazModifiers'); - const onUpdateBaz = meta.events.find(event => event.name === 'update:baz'); + const barModifiers = meta.props.find(prop => prop.name === 'barModifiers'); + const onUpdateBaz = meta.events.find(event => event.name === 'update:bar'); expect(modelValue).toBeDefined(); expect(modelValue?.default).toBeUndefined(); - expect(modelValue?.required).toBeFalsy(); - expect(modelValue?.type).toEqual('number | undefined'); - expect(modelValue?.schema).toEqual({ - kind: 'enum', - type: 'number | undefined', - schema: ['undefined', 'number'], - }); + expect(modelValue?.required).toBeTruthy(); + expect(modelValue?.type).toEqual('number'); + expect(modelValue?.description).toEqual('required number modelValue'); + expect(modelValue?.schema).toEqual('number'); expect(onUpdateModelValue).toBeDefined(); expect(foo).toBeDefined(); - expect(foo?.default).toBeUndefined(); - expect(foo?.required).toBeTruthy(); - expect(foo?.type).toEqual('string[]'); + expect(foo?.default).toBe('false'); + expect(foo?.required).toBeFalsy(); + expect(foo?.type).toEqual('boolean | undefined'); + expect(foo?.description).toEqual('optional boolean foo with default false'); expect(foo?.schema).toEqual({ - kind: 'array', - type: 'string[]', - schema: ['string'], + kind: 'enum', + type: 'boolean | undefined', + schema: ['undefined', 'false', 'true'], }); expect(onUpdateFoo).toBeDefined(); expect(bar).toBeDefined(); - expect(bar?.default).toBe('false'); + expect(bar?.default).toBeUndefined(); expect(bar?.required).toBeFalsy(); - expect(bar?.type).toEqual('boolean | undefined'); + expect(bar?.type).toEqual('string | undefined'); + expect(bar?.description).toEqual('optional string bar with lazy and trim modifiers'); expect(bar?.schema).toEqual({ kind: 'enum', - type: 'boolean | undefined', - schema: ['undefined', 'false', 'true'], + type: 'string | undefined', + schema: ['undefined', 'string'], }); - expect(onUpdateBar).toBeDefined(); - - expect(baz).toBeDefined(); - expect(bazModifiers).toBeDefined(); + // TODO: The types of modifiers are inconsistent in the two running results + expect(barModifiers).toBeDefined(); expect(onUpdateBaz).toBeDefined(); }); diff --git a/packages/language-core/lib/codegen/script/scriptSetup.ts b/packages/language-core/lib/codegen/script/scriptSetup.ts index bce22ccb08..9b62fed63b 100644 --- a/packages/language-core/lib/codegen/script/scriptSetup.ts +++ b/packages/language-core/lib/codegen/script/scriptSetup.ts @@ -103,6 +103,15 @@ function* generateSetupFunction( ctx.scriptSetupGeneratedOffset = options.getGeneratedLength() - scriptSetupRanges.importSectionEndOffset; let setupCodeModifies: [Code[], number, number][] = []; + for (const { comments } of scriptSetupRanges.defineProp) { + if (comments) { + setupCodeModifies.push([ + [``], + comments.start, + comments.end, + ]); + } + } if (scriptSetupRanges.defineProps) { const { name, statement, callExp, typeArg } = scriptSetupRanges.defineProps; setupCodeModifies.push(...generateDefineWithType( @@ -491,6 +500,10 @@ function* generateComponentProps( for (const defineProp of scriptSetupRanges.defineProp) { const [propName, localName] = getPropAndLocalName(scriptSetup, defineProp); + if (defineProp.comments) { + yield generateSfcBlockSection(scriptSetup, defineProp.comments.start, defineProp.comments.end, codeFeatures.all); + yield newLine; + } if (defineProp.isModel && !defineProp.name) { yield propName!; } diff --git a/packages/language-core/lib/codegen/template/elementProps.ts b/packages/language-core/lib/codegen/template/elementProps.ts index de35e27dc3..4ee4906c84 100644 --- a/packages/language-core/lib/codegen/template/elementProps.ts +++ b/packages/language-core/lib/codegen/template/elementProps.ts @@ -135,7 +135,7 @@ export function* generateElementProps( : wrapWith( prop.loc.start.offset, prop.loc.start.offset + 'v-model'.length, - ctx.codeFeatures.verification, + ctx.codeFeatures.withoutHighlightAndCompletion, propName ) ), diff --git a/packages/language-core/lib/parsers/scriptSetupRanges.ts b/packages/language-core/lib/parsers/scriptSetupRanges.ts index 3ba598828f..01e0615c35 100644 --- a/packages/language-core/lib/parsers/scriptSetupRanges.ts +++ b/packages/language-core/lib/parsers/scriptSetupRanges.ts @@ -20,6 +20,7 @@ type DefineProp = { defaultValue?: TextRange; required?: boolean; isModel?: boolean; + comments?: TextRange; // used by component-meta argNode?: ts.Expression; }; @@ -206,6 +207,7 @@ export function parseScriptSetupRanges( defaultValue, required, isModel: true, + comments: getCommentsRange(ts, node, parents, ast), argNode: options, }); } @@ -283,6 +285,7 @@ export function parseScriptSetupRanges( runtimeType, defaultValue, required, + comments: getCommentsRange(ts, node, parents, ast), argNode: options, }); } @@ -589,3 +592,24 @@ function getStatementRange( } return statementRange; } + +function getCommentsRange( + ts: typeof import('typescript'), + node: ts.Node, + parents: ts.Node[], + ast: ts.SourceFile +) { + for (let i = parents.length - 1; i >= 0; i--) { + if (ts.isStatement(node)) { + break; + } + node = parents[i]; + } + const comments = ts.getLeadingCommentRanges(ast.text, node.pos); + if (comments?.length) { + return { + start: comments[0].pos, + end: comments.at(-1)!.end, + }; + } +} diff --git a/packages/tsc/tests/__snapshots__/dts.spec.ts.snap b/packages/tsc/tests/__snapshots__/dts.spec.ts.snap index 5e205b9e98..74bcbc7840 100644 --- a/packages/tsc/tests/__snapshots__/dts.spec.ts.snap +++ b/packages/tsc/tests/__snapshots__/dts.spec.ts.snap @@ -299,22 +299,28 @@ export default _default; exports[`vue-tsc-dts > Input: reference-type-model/component.vue, Output: reference-type-model/component.vue.d.ts 1`] = ` "type __VLS_PublicProps = { - modelValue?: number; - 'foo': string[]; - 'bar'?: boolean; - 'baz'?: string; - 'bazModifiers'?: Partial>; + /** + * required number modelValue + */ + modelValue: number; + /** + * optional boolean foo with default false + */ + 'foo'?: boolean; + /** + * optional string bar with lazy and trim modifiers + */ + 'bar'?: string; + 'barModifiers'?: Partial>; }; declare const _default: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, { "update:modelValue": (value: number) => any; - "update:foo": (value: string[]) => any; - "update:bar": (value: boolean) => any; - "update:baz": (value: string) => any; + "update:foo": (value: boolean) => any; + "update:bar": (value: string) => any; }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{ "onUpdate:modelValue"?: (value: number) => any; - "onUpdate:foo"?: (value: string[]) => any; - "onUpdate:bar"?: (value: boolean) => any; - "onUpdate:baz"?: (value: string) => any; + "onUpdate:foo"?: (value: boolean) => any; + "onUpdate:bar"?: (value: string) => any; }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>; export default _default; " diff --git a/test-workspace/component-meta/reference-type-model/component.vue b/test-workspace/component-meta/reference-type-model/component.vue index 4b48a5abdc..7b96a5b33e 100644 --- a/test-workspace/component-meta/reference-type-model/component.vue +++ b/test-workspace/component-meta/reference-type-model/component.vue @@ -1,10 +1,18 @@ From 130e3b89ce4cb73a509c92b42d9a6c8517d52016 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=B1=B1=E5=90=B9=E8=89=B2=E5=BE=A1=E5=AE=88?= <85992002+KazariEX@users.noreply.github.com> Date: Tue, 25 Feb 2025 22:25:47 +0800 Subject: [PATCH 215/345] fix(language-core): generate camelized prop name for `defineModel` (#5213) --- .../lib/codegen/script/scriptSetup.ts | 43 +++--- .../lib/codegen/template/element.ts | 14 +- .../lib/codegen/template/elementDirectives.ts | 1 + .../lib/codegen/template/elementEvents.ts | 6 +- .../lib/codegen/template/elementProps.ts | 5 +- .../lib/codegen/template/objectProperty.ts | 10 +- .../lib/codegen/template/propertyAccess.ts | 4 +- .../lib/codegen/utils/camelized.ts | 11 +- .../language-core/lib/codegen/utils/index.ts | 2 +- .../lib/parsers/scriptSetupRanges.ts | 135 +++++++----------- .../tsc/tests/__snapshots__/dts.spec.ts.snap | 8 +- .../passedFixtures/vue3/defineModel/main.vue | 6 +- .../vue3/defineModel/script-setup.vue | 4 +- 13 files changed, 115 insertions(+), 134 deletions(-) diff --git a/packages/language-core/lib/codegen/script/scriptSetup.ts b/packages/language-core/lib/codegen/script/scriptSetup.ts index 9b62fed63b..1184b57041 100644 --- a/packages/language-core/lib/codegen/script/scriptSetup.ts +++ b/packages/language-core/lib/codegen/script/scriptSetup.ts @@ -1,7 +1,9 @@ +import { camelize } from '@vue/shared'; import type { ScriptSetupRanges } from '../../parsers/scriptSetupRanges'; import type { Code, Sfc, TextRange } from '../../types'; import { codeFeatures } from '../codeFeatures'; import { combineLastMapping, endOfLine, generateSfcBlockSection, newLine } from '../utils'; +import { generateCamelized } from '../utils/camelized'; import { generateComponent, generateEmitsOption } from './component'; import { generateComponentSelf } from './componentSelf'; import type { ScriptCodegenContext } from './context'; @@ -477,7 +479,7 @@ function* generateComponentProps( } yield `: `; - yield getRangeName(scriptSetup, defineProp.defaultValue); + yield getRangeText(scriptSetup, defineProp.defaultValue); yield `,${newLine}`; } yield `}${endOfLine}`; @@ -491,6 +493,13 @@ function* generateComponentProps( ctx.generatedPropsType = true; yield `${ctx.localTypes.PropsChildren}<__VLS_Slots>`; } + if (scriptSetupRanges.defineProps?.typeArg) { + if (ctx.generatedPropsType) { + yield ` & `; + } + ctx.generatedPropsType = true; + yield `__VLS_Props`; + } if (scriptSetupRanges.defineProp.length) { if (ctx.generatedPropsType) { yield ` & `; @@ -504,11 +513,17 @@ function* generateComponentProps( yield generateSfcBlockSection(scriptSetup, defineProp.comments.start, defineProp.comments.end, codeFeatures.all); yield newLine; } + if (defineProp.isModel && !defineProp.name) { yield propName!; } else if (defineProp.name) { - yield generateSfcBlockSection(scriptSetup, defineProp.name.start, defineProp.name.end, codeFeatures.navigation); + yield* generateCamelized( + getRangeText(scriptSetup, defineProp.name), + scriptSetup.name, + defineProp.name.start, + codeFeatures.navigation + ); } else if (defineProp.localName) { yield generateSfcBlockSection(scriptSetup, defineProp.localName.start, defineProp.localName.end, codeFeatures.navigation); @@ -525,19 +540,12 @@ function* generateComponentProps( if (defineProp.modifierType) { const modifierName = `${defineProp.name ? propName : 'model'}Modifiers`; - const modifierType = getRangeName(scriptSetup, defineProp.modifierType); + const modifierType = getRangeText(scriptSetup, defineProp.modifierType); yield `'${modifierName}'?: Partial>,${newLine}`; } } yield `}`; } - if (scriptSetupRanges.defineProps?.typeArg) { - if (ctx.generatedPropsType) { - yield ` & `; - } - ctx.generatedPropsType = true; - yield `__VLS_Props`; - } if (!ctx.generatedPropsType) { yield `{}`; } @@ -555,7 +563,7 @@ function* generateModelEmit( const [propName, localName] = getPropAndLocalName(scriptSetup, defineModel); yield `'update:${propName}': [value: `; yield* generateDefinePropType(scriptSetup, propName, localName, defineModel); - if (!defineModel.required && defineModel.defaultValue === undefined) { + if (!defineModel.required && !defineModel.defaultValue) { yield ` | undefined`; } yield `]${endOfLine}`; @@ -573,7 +581,7 @@ function* generateDefinePropType( ) { if (defineProp.type) { // Infer from defineProp - yield getRangeName(scriptSetup, defineProp.type); + yield getRangeText(scriptSetup, defineProp.type); } else if (defineProp.runtimeType && localName) { // Infer from actual prop declaration code @@ -593,20 +601,17 @@ function getPropAndLocalName( defineProp: ScriptSetupRanges['defineProp'][number] ) { const localName = defineProp.localName - ? getRangeName(scriptSetup, defineProp.localName) + ? getRangeText(scriptSetup, defineProp.localName) : undefined; - let propName = defineProp.name - ? getRangeName(scriptSetup, defineProp.name) + const propName = defineProp.name + ? camelize(getRangeText(scriptSetup, defineProp.name).slice(1, -1)) : defineProp.isModel ? 'modelValue' : localName; - if (defineProp.name) { - propName = propName!.replace(/['"]+/g, ''); - } return [propName, localName] as const; } -function getRangeName( +function getRangeText( scriptSetup: NonNullable, range: TextRange ) { diff --git a/packages/language-core/lib/codegen/template/element.ts b/packages/language-core/lib/codegen/template/element.ts index 38aba2e045..de3497225b 100644 --- a/packages/language-core/lib/codegen/template/element.ts +++ b/packages/language-core/lib/codegen/template/element.ts @@ -3,7 +3,7 @@ import { camelize, capitalize } from '@vue/shared'; import type { Code, VueCodeInformation } from '../../types'; import { getSlotsPropertyName, hyphenateTag } from '../../utils/shared'; import { createVBindShorthandInlayHintInfo } from '../inlayHints'; -import { endOfLine, newLine, normalizeAttributeValue, variableNameRegex, wrapWith } from '../utils'; +import { endOfLine, identifierRegex, newLine, normalizeAttributeValue, wrapWith } from '../utils'; import { generateCamelized } from '../utils/camelized'; import type { TemplateCodegenContext } from './context'; import { generateElementChildren } from './elementChildren'; @@ -99,6 +99,7 @@ export function* generateComponent( const shouldCapitalize = matchImportName[0].toUpperCase() === matchImportName[0]; yield* generateCamelized( shouldCapitalize ? capitalize(node.tag) : node.tag, + 'template', tagOffset, { ...ctx.codeFeatures.withoutHighlightAndCompletion, @@ -164,7 +165,7 @@ export function* generateComponent( yield `${endOfLine}`; const camelizedTag = camelize(node.tag); - if (variableNameRegex.test(camelizedTag)) { + if (identifierRegex.test(camelizedTag)) { // navigation support yield `/** @type {[`; for (const tagOffset of tagOffsets) { @@ -173,6 +174,7 @@ export function* generateComponent( yield `typeof __VLS_components.`; yield* generateCamelized( shouldCapitalize ? capitalize(node.tag) : node.tag, + 'template', tagOffset, { navigation: { @@ -190,6 +192,7 @@ export function* generateComponent( yield `// @ts-ignore${newLine}`; // #2304 yield* generateCamelized( capitalize(node.tag), + 'template', tagOffsets[0], { completion: { @@ -403,7 +406,7 @@ function* generateFailedPropExps( } function getCanonicalComponentName(tagText: string) { - return variableNameRegex.test(tagText) + return identifierRegex.test(tagText) ? tagText : capitalize(camelize(tagText.replace(colonReg, '-'))); } @@ -423,12 +426,13 @@ function getPossibleOriginalComponentNames(tagText: string, deduplicate: boolean } function* generateCanonicalComponentName(tagText: string, offset: number, features: VueCodeInformation): Generator { - if (variableNameRegex.test(tagText)) { + if (identifierRegex.test(tagText)) { yield [tagText, 'template', offset, features]; } else { yield* generateCamelized( capitalize(tagText.replace(colonReg, '-')), + 'template', offset, features ); @@ -482,7 +486,7 @@ function* generateElementReference( ); yield `} */${endOfLine}`; - if (variableNameRegex.test(content) && !options.templateRefNames.has(content)) { + if (identifierRegex.test(content) && !options.templateRefNames.has(content)) { ctx.accessExternalVariable(content, startOffset); } diff --git a/packages/language-core/lib/codegen/template/elementDirectives.ts b/packages/language-core/lib/codegen/template/elementDirectives.ts index 94630b05b3..71448f9f53 100644 --- a/packages/language-core/lib/codegen/template/elementDirectives.ts +++ b/packages/language-core/lib/codegen/template/elementDirectives.ts @@ -69,6 +69,7 @@ function* generateIdentifier( `__VLS_directives.`, ...generateCamelized( rawName, + 'template', prop.loc.start.offset, ctx.resolveCodeFeatures({ ...codeFeatures.withoutHighlight, diff --git a/packages/language-core/lib/codegen/template/elementEvents.ts b/packages/language-core/lib/codegen/template/elementEvents.ts index 97ce5f20ac..a3af4da972 100644 --- a/packages/language-core/lib/codegen/template/elementEvents.ts +++ b/packages/language-core/lib/codegen/template/elementEvents.ts @@ -2,7 +2,7 @@ import * as CompilerDOM from '@vue/compiler-dom'; import { camelize, capitalize } from '@vue/shared'; import type * as ts from 'typescript'; import type { Code } from '../../types'; -import { combineLastMapping, createTsAst, endOfLine, newLine, variableNameRegex, wrapWith } from '../utils'; +import { combineLastMapping, createTsAst, endOfLine, identifierRegex, newLine, wrapWith } from '../utils'; import { generateCamelized } from '../utils/camelized'; import type { TemplateCodegenContext } from './context'; import type { TemplateCodegenOptions } from './index'; @@ -65,11 +65,12 @@ export function* generateEventArg( ...ctx.codeFeatures.withoutHighlightAndCompletion, ...ctx.codeFeatures.navigationWithoutRename, }; - if (variableNameRegex.test(camelize(name))) { + if (identifierRegex.test(camelize(name))) { yield ['', 'template', start, features]; yield directive; yield* generateCamelized( capitalize(name), + 'template', start, combineLastMapping ); @@ -84,6 +85,7 @@ export function* generateEventArg( directive, ...generateCamelized( capitalize(name), + 'template', start, combineLastMapping ), diff --git a/packages/language-core/lib/codegen/template/elementProps.ts b/packages/language-core/lib/codegen/template/elementProps.ts index 4ee4906c84..80aaef1a18 100644 --- a/packages/language-core/lib/codegen/template/elementProps.ts +++ b/packages/language-core/lib/codegen/template/elementProps.ts @@ -6,7 +6,7 @@ import type { Code, VueCodeInformation, VueCompilerOptions } from '../../types'; import { hyphenateAttr, hyphenateTag } from '../../utils/shared'; import { codeFeatures } from '../codeFeatures'; import { createVBindShorthandInlayHintInfo } from '../inlayHints'; -import { newLine, variableNameRegex, wrapWith } from '../utils'; +import { identifierRegex, newLine, wrapWith } from '../utils'; import { generateCamelized } from '../utils/camelized'; import { generateUnicode } from '../utils/unicode'; import type { TemplateCodegenContext } from './context'; @@ -303,12 +303,13 @@ export function* generatePropExp( else { const propVariableName = camelize(exp.loc.source); - if (variableNameRegex.test(propVariableName)) { + if (identifierRegex.test(propVariableName)) { const isDestructuredProp = options.destructuredPropNames?.has(propVariableName) ?? false; const isTemplateRef = options.templateRefNames?.has(propVariableName) ?? false; const codes = generateCamelized( exp.loc.source, + 'template', exp.loc.start.offset, features ); diff --git a/packages/language-core/lib/codegen/template/objectProperty.ts b/packages/language-core/lib/codegen/template/objectProperty.ts index 78df1a85c6..0bdf9facae 100644 --- a/packages/language-core/lib/codegen/template/objectProperty.ts +++ b/packages/language-core/lib/codegen/template/objectProperty.ts @@ -1,6 +1,6 @@ import { camelize } from '@vue/shared'; import type { Code, VueCodeInformation } from '../../types'; -import { combineLastMapping, variableNameRegex, wrapWith } from '../utils'; +import { combineLastMapping, identifierRegex, wrapWith } from '../utils'; import { generateCamelized } from '../utils/camelized'; import { generateStringLiteralKey } from '../utils/stringLiteralKey'; import type { TemplateCodegenContext } from './context'; @@ -44,8 +44,8 @@ export function* generateObjectProperty( } } else if (shouldCamelize) { - if (variableNameRegex.test(camelize(code))) { - yield* generateCamelized(code, offset, features); + if (identifierRegex.test(camelize(code))) { + yield* generateCamelized(code, 'template', offset, features); } else { yield* wrapWith( @@ -53,13 +53,13 @@ export function* generateObjectProperty( offset + code.length, features, `'`, - ...generateCamelized(code, offset, combineLastMapping), + ...generateCamelized(code, 'template', offset, combineLastMapping), `'` ); } } else { - if (variableNameRegex.test(code)) { + if (identifierRegex.test(code)) { yield [code, 'template', offset, features]; } else { diff --git a/packages/language-core/lib/codegen/template/propertyAccess.ts b/packages/language-core/lib/codegen/template/propertyAccess.ts index 0733d38b01..3c9a5fedd1 100644 --- a/packages/language-core/lib/codegen/template/propertyAccess.ts +++ b/packages/language-core/lib/codegen/template/propertyAccess.ts @@ -1,5 +1,5 @@ import type { Code, VueCodeInformation } from '../../types'; -import { variableNameRegex } from '../utils'; +import { identifierRegex } from '../utils'; import { generateStringLiteralKey } from '../utils/stringLiteralKey'; import type { TemplateCodegenContext } from './context'; import type { TemplateCodegenOptions } from './index'; @@ -13,7 +13,7 @@ export function* generatePropertyAccess( features?: VueCodeInformation, astHolder?: any ): Generator { - if (!options.compilerOptions.noPropertyAccessFromIndexSignature && variableNameRegex.test(code)) { + if (!options.compilerOptions.noPropertyAccessFromIndexSignature && identifierRegex.test(code)) { yield `.`; yield offset !== undefined && features ? [code, 'template', offset, features] diff --git a/packages/language-core/lib/codegen/utils/camelized.ts b/packages/language-core/lib/codegen/utils/camelized.ts index 5adf5e66b6..1d8ca4e84a 100644 --- a/packages/language-core/lib/codegen/utils/camelized.ts +++ b/packages/language-core/lib/codegen/utils/camelized.ts @@ -1,7 +1,12 @@ import { capitalize } from '@vue/shared'; import type { Code, VueCodeInformation } from '../../types'; -export function* generateCamelized(code: string, offset: number, info: VueCodeInformation): Generator { +export function* generateCamelized( + code: string, + source: string, + offset: number, + info: VueCodeInformation +): Generator { const parts = code.split('-'); for (let i = 0; i < parts.length; i++) { const part = parts[i]; @@ -9,7 +14,7 @@ export function* generateCamelized(code: string, offset: number, info: VueCodeIn if (i === 0) { yield [ part, - 'template', + source, offset, info, ]; @@ -17,7 +22,7 @@ export function* generateCamelized(code: string, offset: number, info: VueCodeIn else { yield [ capitalize(part), - 'template', + source, offset, { __combineOffset: i }, ]; diff --git a/packages/language-core/lib/codegen/utils/index.ts b/packages/language-core/lib/codegen/utils/index.ts index 7bdac7e272..0684ef6c3a 100644 --- a/packages/language-core/lib/codegen/utils/index.ts +++ b/packages/language-core/lib/codegen/utils/index.ts @@ -6,7 +6,7 @@ import type { Code, SfcBlock, SfcBlockAttr, VueCodeInformation } from '../../typ export const newLine = `\n`; export const endOfLine = `;${newLine}`; export const combineLastMapping: VueCodeInformation = { __combineOffset: 1 }; -export const variableNameRegex = /^[a-zA-Z_$][0-9a-zA-Z_$]*$/; +export const identifierRegex = /^[a-zA-Z_$][0-9a-zA-Z_$]*$/; export function* wrapWith( startOffset: number, diff --git a/packages/language-core/lib/parsers/scriptSetupRanges.ts b/packages/language-core/lib/parsers/scriptSetupRanges.ts index 01e0615c35..1d3dbf7ae4 100644 --- a/packages/language-core/lib/parsers/scriptSetupRanges.ts +++ b/packages/language-core/lib/parsers/scriptSetupRanges.ts @@ -153,10 +153,16 @@ export function parseScriptSetupRanges( && ts.isIdentifier(node.expression) ) { const callText = _getNodeText(node.expression); - if (vueCompilerOptions.macros.defineModel.includes(callText)) { + const isDefineModel = vueCompilerOptions.macros.defineModel.includes(callText); + if (isDefineModel || callText === 'defineProp') { let localName: TextRange | undefined; - let propName: TextRange | undefined; + let propName: ts.Expression | undefined; let options: ts.Expression | undefined; + let type: TextRange | undefined; + let modifierType: TextRange | undefined; + let runtimeType: TextRange | undefined; + let defaultValue: TextRange | undefined; + let required = false; if ( ts.isVariableDeclaration(parent) && @@ -165,91 +171,35 @@ export function parseScriptSetupRanges( localName = _getStartEnd(parent.name); } - if (node.arguments.length >= 2) { - propName = _getStartEnd(node.arguments[0]); - options = node.arguments[1]; - } - else if (node.arguments.length >= 1) { - if (ts.isStringLiteralLike(node.arguments[0])) { - propName = _getStartEnd(node.arguments[0]); + if (node.typeArguments) { + if (node.typeArguments.length >= 1) { + type = _getStartEnd(node.typeArguments[0]); } - else { - options = node.arguments[0]; + if (node.typeArguments.length >= 2) { + modifierType = _getStartEnd(node.typeArguments[1]); } } - let runtimeType: TextRange | undefined; - let defaultValue: TextRange | undefined; - let required = false; - if (options && ts.isObjectLiteralExpression(options)) { - for (const property of options.properties) { - if (!ts.isPropertyAssignment(property) || !ts.isIdentifier(property.name)) { - continue; - } - const text = _getNodeText(property.name); - if (text === 'type') { - runtimeType = _getStartEnd(property.initializer); - } - else if (text === 'default') { - defaultValue = _getStartEnd(property.initializer); + if (isDefineModel) { + if (node.arguments.length >= 2) { + propName = node.arguments[0]; + options = node.arguments[1]; + } + else if (node.arguments.length >= 1) { + if (ts.isStringLiteralLike(node.arguments[0])) { + propName = node.arguments[0]; } - else if (text === 'required' && property.initializer.kind === ts.SyntaxKind.TrueKeyword) { - required = true; + else { + options = node.arguments[0]; } } } - defineProp.push({ - localName, - name: propName, - type: node.typeArguments?.length ? _getStartEnd(node.typeArguments[0]) : undefined, - modifierType: node.typeArguments && node.typeArguments?.length >= 2 ? _getStartEnd(node.typeArguments[1]) : undefined, - runtimeType, - defaultValue, - required, - isModel: true, - comments: getCommentsRange(ts, node, parents, ast), - argNode: options, - }); - } - else if (callText === 'defineProp') { - let localName: TextRange | undefined; - let propName: TextRange | undefined; - let options: ts.Expression | undefined; - - if ( - ts.isVariableDeclaration(parent) && - ts.isIdentifier(parent.name) - ) { - localName = _getStartEnd(parent.name); - } - - let runtimeType: TextRange | undefined; - let defaultValue: TextRange | undefined; - let required = false; - if (definePropProposalA) { + else if (definePropProposalA) { if (node.arguments.length >= 2) { options = node.arguments[1]; } if (node.arguments.length >= 1) { - propName = _getStartEnd(node.arguments[0]); - } - - if (options && ts.isObjectLiteralExpression(options)) { - for (const property of options.properties) { - if (!ts.isPropertyAssignment(property) || !ts.isIdentifier(property.name)) { - continue; - } - const text = _getNodeText(property.name); - if (text === 'type') { - runtimeType = _getStartEnd(property.initializer); - } - else if (text === 'default') { - defaultValue = _getStartEnd(property.initializer); - } - else if (text === 'required' && property.initializer.kind === ts.SyntaxKind.TrueKeyword) { - required = true; - } - } + propName = node.arguments[0]; } } else if (definePropProposalB) { @@ -264,27 +214,40 @@ export function parseScriptSetupRanges( if (node.arguments.length >= 1) { defaultValue = _getStartEnd(node.arguments[0]); } + } - if (options && ts.isObjectLiteralExpression(options)) { - for (const property of options.properties) { - if (!ts.isPropertyAssignment(property) || !ts.isIdentifier(property.name)) { - continue; - } - const text = _getNodeText(property.name); - if (text === 'type') { - runtimeType = _getStartEnd(property.initializer); - } + if (options && ts.isObjectLiteralExpression(options)) { + for (const property of options.properties) { + if (!ts.isPropertyAssignment(property) || !ts.isIdentifier(property.name)) { + continue; + } + const text = _getNodeText(property.name); + if (text === 'type') { + runtimeType = _getStartEnd(property.initializer); + } + else if (text === 'default') { + defaultValue = _getStartEnd(property.initializer); + } + else if (text === 'required' && property.initializer.kind === ts.SyntaxKind.TrueKeyword) { + required = true; } } } + let name: TextRange | undefined; + if (propName && ts.isStringLiteralLike(propName)) { + name = _getStartEnd(propName); + } + defineProp.push({ localName, - name: propName, - type: node.typeArguments?.length ? _getStartEnd(node.typeArguments[0]) : undefined, + name, + type, + modifierType, runtimeType, defaultValue, required, + isModel: isDefineModel, comments: getCommentsRange(ts, node, parents, ast), argNode: options, }); diff --git a/packages/tsc/tests/__snapshots__/dts.spec.ts.snap b/packages/tsc/tests/__snapshots__/dts.spec.ts.snap index 74bcbc7840..23f9484a8d 100644 --- a/packages/tsc/tests/__snapshots__/dts.spec.ts.snap +++ b/packages/tsc/tests/__snapshots__/dts.spec.ts.snap @@ -90,9 +90,9 @@ exports[`vue-tsc-dts > Input: generic/component.vue, Output: generic/component.v readonly "onUpdate:title"?: (value: string) => any; readonly onBar?: (data: number) => any; } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:title" | "onBar"> & ({ - title?: string; - } & { foo: number; + } & { + title?: string; }) & Partial<{}>> & import("vue").PublicProps; expose(exposed: import("vue").ShallowUnwrapRef<{ baz: number; @@ -120,9 +120,9 @@ exports[`vue-tsc-dts > Input: generic/custom-extension-component.cext, Output: g readonly "onUpdate:title"?: (value: string) => any; readonly onBar?: (data: number) => any; } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:title" | "onBar"> & ({ - title?: string; - } & { foo: number; + } & { + title?: string; }) & Partial<{}>> & import("vue").PublicProps; expose(exposed: import("vue").ShallowUnwrapRef<{ baz: number; diff --git a/test-workspace/tsc/passedFixtures/vue3/defineModel/main.vue b/test-workspace/tsc/passedFixtures/vue3/defineModel/main.vue index 749963ce8c..bb25b68577 100644 --- a/test-workspace/tsc/passedFixtures/vue3/defineModel/main.vue +++ b/test-workspace/tsc/passedFixtures/vue3/defineModel/main.vue @@ -10,7 +10,7 @@ const ScriptSetupExact = defineComponent({ 'd'?: number, 'e': string, 'f'?: string, - 'g'?: string, + 'gG'?: string, }, __typeEmits: {} as { 'update:modelValue': [modelValue: string | undefined]; @@ -18,7 +18,7 @@ const ScriptSetupExact = defineComponent({ 'update:d': [d: number | undefined]; 'update:e': [e: string]; 'update:f': [f: string | undefined]; - 'update:g': [g: string | undefined]; + 'update:gG': [g: string | undefined]; }, setup() { return {}; @@ -37,6 +37,6 @@ exactType(ScriptSetup, ScriptSetupExact); @update:d="(x) => exactType(x, {} as number | undefined)" @update:e="(x) => exactType(x, {} as string)" @update:f="(x) => exactType(x, {} as string | undefined)" - @update:g="(x) => exactType(x, {} as string | undefined)" + @update:g-g="(x) => exactType(x, {} as string | undefined)" /> diff --git a/test-workspace/tsc/passedFixtures/vue3/defineModel/script-setup.vue b/test-workspace/tsc/passedFixtures/vue3/defineModel/script-setup.vue index 4eb409804a..7a93bcfc75 100644 --- a/test-workspace/tsc/passedFixtures/vue3/defineModel/script-setup.vue +++ b/test-workspace/tsc/passedFixtures/vue3/defineModel/script-setup.vue @@ -7,7 +7,7 @@ const c = defineModel('c', { required: true }); const d = defineModel('d', { required: false }); const e = defineModel('e', { required: true }); const f = defineModel('f', { required: false }); -const g = defineModel('g'); +const g = defineModel('g-g'); exactType(a.value, {} as string | undefined); // exactType(b.value, {} as string); @@ -25,5 +25,5 @@ exactType(g.value, {} as string | undefined); {{ exactType($props.d, {} as number | undefined) }} {{ exactType($props.e, {} as string) }} {{ exactType($props.f, {} as string | undefined) }} - {{ exactType($props.g, {} as string | undefined) }} + {{ exactType($props.gG, {} as string | undefined) }} From 33e85c0c90a2fc52a76b207dc75f506a4f2d7824 Mon Sep 17 00:00:00 2001 From: KazariEX <1364035137@qq.com> Date: Wed, 26 Feb 2025 01:31:03 +0800 Subject: [PATCH 216/345] refactor(language-core): use `yield*` instead of `for...of` + `yield` --- packages/language-core/lib/codegen/script/component.ts | 4 +--- packages/language-core/lib/codegen/script/componentSelf.ts | 4 +--- packages/language-core/lib/codegen/script/template.ts | 4 +--- packages/language-core/lib/codegen/template/vIf.ts | 4 +--- 4 files changed, 4 insertions(+), 12 deletions(-) diff --git a/packages/language-core/lib/codegen/script/component.ts b/packages/language-core/lib/codegen/script/component.ts index 20a6d42858..2a732228b1 100644 --- a/packages/language-core/lib/codegen/script/component.ts +++ b/packages/language-core/lib/codegen/script/component.ts @@ -32,9 +32,7 @@ export function* generateComponent( yield `},${newLine}`; if (!ctx.bypassDefineComponent) { const emitOptionCodes = [...generateEmitsOption(options, scriptSetupRanges)]; - for (const code of emitOptionCodes) { - yield code; - } + yield* emitOptionCodes; yield* generatePropsOption(options, ctx, scriptSetup, scriptSetupRanges, !!emitOptionCodes.length, true); } if ( diff --git a/packages/language-core/lib/codegen/script/componentSelf.ts b/packages/language-core/lib/codegen/script/componentSelf.ts index ef17b359ec..bbcd9fe092 100644 --- a/packages/language-core/lib/codegen/script/componentSelf.ts +++ b/packages/language-core/lib/codegen/script/componentSelf.ts @@ -51,9 +51,7 @@ export function* generateComponentSelf( yield `},${newLine}`; // setup() { if (options.sfc.scriptSetup && options.scriptSetupRanges && !ctx.bypassDefineComponent) { const emitOptionCodes = [...generateEmitsOption(options, options.scriptSetupRanges)]; - for (const code of emitOptionCodes) { - yield code; - } + yield* emitOptionCodes; yield* generatePropsOption(options, ctx, options.sfc.scriptSetup, options.scriptSetupRanges, !!emitOptionCodes.length, false); } if (options.sfc.script && options.scriptRanges?.exportDefault?.args) { diff --git a/packages/language-core/lib/codegen/script/template.ts b/packages/language-core/lib/codegen/script/template.ts index 56bc80aafb..49fc5f0350 100644 --- a/packages/language-core/lib/codegen/script/template.ts +++ b/packages/language-core/lib/codegen/script/template.ts @@ -121,9 +121,7 @@ function* generateTemplateBody( yield* generateCssVars(options, templateCodegenCtx); if (options.templateCodegen) { - for (const code of options.templateCodegen.codes) { - yield code; - } + yield* options.templateCodegen.codes; } else { yield `// no template${newLine}`; diff --git a/packages/language-core/lib/codegen/template/vIf.ts b/packages/language-core/lib/codegen/template/vIf.ts index 32835ff7a2..a65c70297c 100644 --- a/packages/language-core/lib/codegen/template/vIf.ts +++ b/packages/language-core/lib/codegen/template/vIf.ts @@ -45,9 +45,7 @@ export function* generateVIf( `)` ), ]; - for (const code of codes) { - yield code; - } + yield* codes; ctx.blockConditions.push(toString(codes)); addedBlockCondition = true; yield ` `; From 4e93e73b77a62732ea5b56fc7b6946cb8e50090f Mon Sep 17 00:00:00 2001 From: KazariEX <1364035137@qq.com> Date: Wed, 26 Feb 2025 01:35:47 +0800 Subject: [PATCH 217/345] fix(language-core): prevent redundant generator execution when codes need reuse --- .../lib/codegen/template/elementProps.ts | 24 +++++++++---------- .../language-core/lib/codegen/template/vIf.ts | 24 +++++++++---------- 2 files changed, 23 insertions(+), 25 deletions(-) diff --git a/packages/language-core/lib/codegen/template/elementProps.ts b/packages/language-core/lib/codegen/template/elementProps.ts index 80aaef1a18..9f24dc7f06 100644 --- a/packages/language-core/lib/codegen/template/elementProps.ts +++ b/packages/language-core/lib/codegen/template/elementProps.ts @@ -117,7 +117,7 @@ export function* generateElementProps( if (shouldSpread) { yield `...{ `; } - const codes = wrapWith( + const codes = [...wrapWith( prop.loc.start.offset, prop.loc.end.offset, ctx.codeFeatures.verification, @@ -148,12 +148,12 @@ export function* generateElementProps( ctx.codeFeatures.all, enableCodeFeatures ) - ); + )]; if (enableCodeFeatures) { yield* codes; } else { - yield toString([...codes]); + yield toString(codes); } if (shouldSpread) { yield ` }`; @@ -166,17 +166,17 @@ export function* generateElementProps( ? `[__VLS_tryAsConstant(\`$\{${prop.arg.content}\}Modifiers\`)]` : camelize(propName) + `Modifiers` : `modelModifiers`; - const codes = generateModifiers( + const codes = [...generateModifiers( options, ctx, prop, propertyName - ); + )]; if (enableCodeFeatures) { yield* codes; } else { - yield toString([...codes]); + yield toString(codes); } yield newLine; } @@ -201,7 +201,7 @@ export function* generateElementProps( if (shouldSpread) { yield `...{ `; } - const codes = wrapWith( + const codes = [...wrapWith( prop.loc.start.offset, prop.loc.end.offset, ctx.codeFeatures.verification, @@ -220,12 +220,12 @@ export function* generateElementProps( ? generateAttrValue(prop.value, ctx.codeFeatures.withoutNavigation) : [`true`] ) - ); + )]; if (enableCodeFeatures) { yield* codes; } else { - yield toString([...codes]); + yield toString(codes); } if (shouldSpread) { yield ` }`; @@ -244,7 +244,7 @@ export function* generateElementProps( } } else { - const codes = wrapWith( + const codes = [...wrapWith( prop.exp.loc.start.offset, prop.exp.loc.end.offset, ctx.codeFeatures.verification, @@ -257,12 +257,12 @@ export function* generateElementProps( ctx.codeFeatures.all, enableCodeFeatures ) - ); + )]; if (enableCodeFeatures) { yield* codes; } else { - yield toString([...codes]); + yield toString(codes); } yield `,${newLine}`; } diff --git a/packages/language-core/lib/codegen/template/vIf.ts b/packages/language-core/lib/codegen/template/vIf.ts index a65c70297c..21c03fe767 100644 --- a/packages/language-core/lib/codegen/template/vIf.ts +++ b/packages/language-core/lib/codegen/template/vIf.ts @@ -32,19 +32,17 @@ export function* generateVIf( let addedBlockCondition = false; if (branch.condition?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION) { - const codes = [ - ...generateInterpolation( - options, - ctx, - 'template', - ctx.codeFeatures.all, - branch.condition.content, - branch.condition.loc.start.offset, - branch.condition.loc, - `(`, - `)` - ), - ]; + const codes = [...generateInterpolation( + options, + ctx, + 'template', + ctx.codeFeatures.all, + branch.condition.content, + branch.condition.loc.start.offset, + branch.condition.loc, + `(`, + `)` + )]; yield* codes; ctx.blockConditions.push(toString(codes)); addedBlockCondition = true; From 4669a5478f4757a1bdc8b680c0c6a2fcdedf6ce0 Mon Sep 17 00:00:00 2001 From: KazariEX <1364035137@qq.com> Date: Wed, 26 Feb 2025 02:58:37 +0800 Subject: [PATCH 218/345] refactor(language-core): extract `generateEscaped` --- .../codegen/template/styleScopedClasses.ts | 50 ++++--------------- .../lib/codegen/utils/escaped.ts | 27 ++++++++++ 2 files changed, 37 insertions(+), 40 deletions(-) create mode 100644 packages/language-core/lib/codegen/utils/escaped.ts diff --git a/packages/language-core/lib/codegen/template/styleScopedClasses.ts b/packages/language-core/lib/codegen/template/styleScopedClasses.ts index 17d8f55135..57f27c6c64 100644 --- a/packages/language-core/lib/codegen/template/styleScopedClasses.ts +++ b/packages/language-core/lib/codegen/template/styleScopedClasses.ts @@ -3,9 +3,12 @@ import type * as ts from 'typescript'; import { getNodeText } from '../../parsers/scriptSetupRanges'; import type { Code } from '../../types'; import { endOfLine, normalizeAttributeValue } from '../utils'; +import { generateEscaped } from '../utils/escaped'; import type { TemplateCodegenContext } from './context'; import type { TemplateCodegenOptions } from './index'; +const classNameEscapeRegex = /([\\'])/; + export function* generateStyleScopedClassReferences( ctx: TemplateCodegenContext, withDot = false @@ -31,7 +34,13 @@ export function* generateStyleScopedClassReferences( yield `'`; // fix https://github.com/vuejs/language-tools/issues/4537 - yield* escapeString(source, className, offset, ['\\', '\'']); + yield* generateEscaped( + className, + source, + offset, + ctx.codeFeatures.navigationAndAdditionalCompletion, + classNameEscapeRegex + ); yield `'`; yield [ '', @@ -41,45 +50,6 @@ export function* generateStyleScopedClassReferences( ]; yield `]} */${endOfLine}`; } - - function* escapeString(source: string, className: string, offset: number, escapeTargets: string[]): Generator { - let count = 0; - - const currentEscapeTargets = [...escapeTargets]; - const firstEscapeTarget = currentEscapeTargets.shift()!; - const splitted = className.split(firstEscapeTarget); - - for (let i = 0; i < splitted.length; i++) { - const part = splitted[i]; - const partLength = part.length; - - if (escapeTargets.length > 0) { - yield* escapeString(source, part, offset + count, [...currentEscapeTargets]); - } else { - yield [ - part, - source, - offset + count, - ctx.codeFeatures.navigationAndAdditionalCompletion, - ]; - } - - if (i !== splitted.length - 1) { - yield '\\'; - - yield [ - firstEscapeTarget, - source, - offset + count + partLength, - ctx.codeFeatures.navigationAndAdditionalCompletion, - ]; - - count += partLength + 1; - } else { - count += partLength; - } - } - } } export function collectStyleScopedClassReferences( diff --git a/packages/language-core/lib/codegen/utils/escaped.ts b/packages/language-core/lib/codegen/utils/escaped.ts new file mode 100644 index 0000000000..a726105e05 --- /dev/null +++ b/packages/language-core/lib/codegen/utils/escaped.ts @@ -0,0 +1,27 @@ +import type { Code, VueCodeInformation } from "../../types"; + +export function* generateEscaped( + text: string, + source: string, + offset: number, + features: VueCodeInformation, + escapeTarget: RegExp +): Generator { + const parts = text.split(escapeTarget); + let isEscapeTarget = false; + + for (let i = 0; i < parts.length; i++) { + const part = parts[i]; + if (isEscapeTarget) { + yield `\\`; + } + yield [ + part, + source, + offset, + i === 0 ? features : { __combineOffset: i }, + ]; + offset += part.length; + isEscapeTarget = !isEscapeTarget; + } +} From 32faaad0b98fb00286d7ff399d770d5bf26961ed Mon Sep 17 00:00:00 2001 From: KazariEX <1364035137@qq.com> Date: Wed, 26 Feb 2025 03:39:21 +0800 Subject: [PATCH 219/345] refactor(language-core): overload `wrapWith` to use in more sources --- .../lib/codegen/script/scriptSetup.ts | 13 ++++-- .../lib/codegen/style/classProperty.ts | 31 ++++++-------- .../lib/codegen/template/context.ts | 3 +- .../lib/codegen/template/element.ts | 3 +- .../lib/codegen/template/elementDirectives.ts | 3 +- .../lib/codegen/template/elementEvents.ts | 4 +- .../lib/codegen/template/elementProps.ts | 3 +- .../lib/codegen/template/index.ts | 3 +- .../lib/codegen/template/objectProperty.ts | 3 +- .../lib/codegen/template/slotOutlet.ts | 3 +- .../codegen/template/styleScopedClasses.ts | 33 ++++++--------- .../lib/codegen/template/vSlot.ts | 3 +- .../lib/codegen/utils/camelized.ts | 8 ++-- .../lib/codegen/utils/escaped.ts | 3 +- .../language-core/lib/codegen/utils/index.ts | 17 -------- .../lib/codegen/utils/stringLiteralKey.ts | 3 +- .../lib/codegen/utils/unicode.ts | 2 +- .../lib/codegen/utils/wrapWith.ts | 42 +++++++++++++++++++ 18 files changed, 105 insertions(+), 75 deletions(-) create mode 100644 packages/language-core/lib/codegen/utils/wrapWith.ts diff --git a/packages/language-core/lib/codegen/script/scriptSetup.ts b/packages/language-core/lib/codegen/script/scriptSetup.ts index 1184b57041..b07dcaf420 100644 --- a/packages/language-core/lib/codegen/script/scriptSetup.ts +++ b/packages/language-core/lib/codegen/script/scriptSetup.ts @@ -2,8 +2,9 @@ import { camelize } from '@vue/shared'; import type { ScriptSetupRanges } from '../../parsers/scriptSetupRanges'; import type { Code, Sfc, TextRange } from '../../types'; import { codeFeatures } from '../codeFeatures'; -import { combineLastMapping, endOfLine, generateSfcBlockSection, newLine } from '../utils'; +import { endOfLine, generateSfcBlockSection, newLine } from '../utils'; import { generateCamelized } from '../utils/camelized'; +import { wrapWith } from '../utils/wrapWith'; import { generateComponent, generateEmitsOption } from './component'; import { generateComponentSelf } from './componentSelf'; import type { ScriptCodegenContext } from './context'; @@ -215,9 +216,13 @@ function* generateSetupFunction( `])` ] : [ ` as __VLS_StyleModules[`, - ['', scriptSetup.name, exp.start, codeFeatures.verification], - `'$style'`, - ['', scriptSetup.name, exp.end, combineLastMapping], + ...wrapWith( + exp.start, + exp.end, + scriptSetup.name, + codeFeatures.verification, + `'$style'` + ), `])` ], callExp.end, diff --git a/packages/language-core/lib/codegen/style/classProperty.ts b/packages/language-core/lib/codegen/style/classProperty.ts index b1fe9ea2ce..892fa9752c 100644 --- a/packages/language-core/lib/codegen/style/classProperty.ts +++ b/packages/language-core/lib/codegen/style/classProperty.ts @@ -1,6 +1,7 @@ import type { Code } from '../../types'; import { codeFeatures } from '../codeFeatures'; -import { newLine } from '../utils'; +import { combineLastMapping, newLine } from '../utils'; +import { wrapWith } from '../utils/wrapWith'; export function* generateClassProperty( styleIndex: number, @@ -9,26 +10,20 @@ export function* generateClassProperty( propertyType: string ): Generator { yield `${newLine} & { `; - yield [ - '', - 'style_' + styleIndex, + yield* wrapWith( offset, - codeFeatures.navigation, - ]; - yield `'`; - yield [ - classNameWithDot.slice(1), - 'style_' + styleIndex, - offset + 1, - codeFeatures.navigation, - ]; - yield `'`; - yield [ - '', - 'style_' + styleIndex, offset + classNameWithDot.length, + 'style_' + styleIndex, codeFeatures.navigation, - ]; + `'`, + [ + classNameWithDot.slice(1), + 'style_' + styleIndex, + offset + 1, + combineLastMapping + ], + `'` + ); yield `: ${propertyType}`; yield ` }`; } diff --git a/packages/language-core/lib/codegen/template/context.ts b/packages/language-core/lib/codegen/template/context.ts index cad062b01b..1c716bf352 100644 --- a/packages/language-core/lib/codegen/template/context.ts +++ b/packages/language-core/lib/codegen/template/context.ts @@ -2,7 +2,8 @@ import type * as CompilerDOM from '@vue/compiler-dom'; import type { Code, VueCodeInformation } from '../../types'; import { codeFeatures } from '../codeFeatures'; import { InlayHintInfo } from '../inlayHints'; -import { endOfLine, newLine, wrapWith } from '../utils'; +import { endOfLine, newLine } from '../utils'; +import { wrapWith } from '../utils/wrapWith'; import type { TemplateCodegenOptions } from './index'; export type TemplateCodegenContext = ReturnType; diff --git a/packages/language-core/lib/codegen/template/element.ts b/packages/language-core/lib/codegen/template/element.ts index de3497225b..4139bdad3b 100644 --- a/packages/language-core/lib/codegen/template/element.ts +++ b/packages/language-core/lib/codegen/template/element.ts @@ -3,8 +3,9 @@ import { camelize, capitalize } from '@vue/shared'; import type { Code, VueCodeInformation } from '../../types'; import { getSlotsPropertyName, hyphenateTag } from '../../utils/shared'; import { createVBindShorthandInlayHintInfo } from '../inlayHints'; -import { endOfLine, identifierRegex, newLine, normalizeAttributeValue, wrapWith } from '../utils'; +import { endOfLine, identifierRegex, newLine, normalizeAttributeValue } from '../utils'; import { generateCamelized } from '../utils/camelized'; +import { wrapWith } from '../utils/wrapWith'; import type { TemplateCodegenContext } from './context'; import { generateElementChildren } from './elementChildren'; import { generateElementDirectives } from './elementDirectives'; diff --git a/packages/language-core/lib/codegen/template/elementDirectives.ts b/packages/language-core/lib/codegen/template/elementDirectives.ts index 71448f9f53..689e94fbf3 100644 --- a/packages/language-core/lib/codegen/template/elementDirectives.ts +++ b/packages/language-core/lib/codegen/template/elementDirectives.ts @@ -3,9 +3,10 @@ import { camelize } from '@vue/shared'; import type { Code } from '../../types'; import { hyphenateAttr } from '../../utils/shared'; import { codeFeatures } from '../codeFeatures'; -import { endOfLine, wrapWith } from '../utils'; +import { endOfLine } from '../utils'; import { generateCamelized } from '../utils/camelized'; import { generateStringLiteralKey } from '../utils/stringLiteralKey'; +import { wrapWith } from '../utils/wrapWith'; import type { TemplateCodegenContext } from './context'; import { generatePropExp } from './elementProps'; import type { TemplateCodegenOptions } from './index'; diff --git a/packages/language-core/lib/codegen/template/elementEvents.ts b/packages/language-core/lib/codegen/template/elementEvents.ts index a3af4da972..7e2455bbb7 100644 --- a/packages/language-core/lib/codegen/template/elementEvents.ts +++ b/packages/language-core/lib/codegen/template/elementEvents.ts @@ -2,8 +2,9 @@ import * as CompilerDOM from '@vue/compiler-dom'; import { camelize, capitalize } from '@vue/shared'; import type * as ts from 'typescript'; import type { Code } from '../../types'; -import { combineLastMapping, createTsAst, endOfLine, identifierRegex, newLine, wrapWith } from '../utils'; +import { combineLastMapping, createTsAst, endOfLine, identifierRegex, newLine } from '../utils'; import { generateCamelized } from '../utils/camelized'; +import { wrapWith } from '../utils/wrapWith'; import type { TemplateCodegenContext } from './context'; import type { TemplateCodegenOptions } from './index'; import { generateInterpolation } from './interpolation'; @@ -81,7 +82,6 @@ export function* generateEventArg( start + name.length, features, `'`, - ['', 'template', start, combineLastMapping], directive, ...generateCamelized( capitalize(name), diff --git a/packages/language-core/lib/codegen/template/elementProps.ts b/packages/language-core/lib/codegen/template/elementProps.ts index 9f24dc7f06..54eafb1bd0 100644 --- a/packages/language-core/lib/codegen/template/elementProps.ts +++ b/packages/language-core/lib/codegen/template/elementProps.ts @@ -6,9 +6,10 @@ import type { Code, VueCodeInformation, VueCompilerOptions } from '../../types'; import { hyphenateAttr, hyphenateTag } from '../../utils/shared'; import { codeFeatures } from '../codeFeatures'; import { createVBindShorthandInlayHintInfo } from '../inlayHints'; -import { identifierRegex, newLine, wrapWith } from '../utils'; +import { identifierRegex, newLine } from '../utils'; import { generateCamelized } from '../utils/camelized'; import { generateUnicode } from '../utils/unicode'; +import { wrapWith } from '../utils/wrapWith'; import type { TemplateCodegenContext } from './context'; import { generateModifiers } from './elementDirectives'; import { generateEventArg, generateEventExpression } from './elementEvents'; diff --git a/packages/language-core/lib/codegen/template/index.ts b/packages/language-core/lib/codegen/template/index.ts index 8776db6c17..430bdf9fbf 100644 --- a/packages/language-core/lib/codegen/template/index.ts +++ b/packages/language-core/lib/codegen/template/index.ts @@ -2,7 +2,8 @@ import * as CompilerDOM from '@vue/compiler-dom'; import type * as ts from 'typescript'; import type { Code, Sfc, VueCompilerOptions } from '../../types'; import { getSlotsPropertyName } from '../../utils/shared'; -import { endOfLine, newLine, wrapWith } from '../utils'; +import { endOfLine, newLine } from '../utils'; +import { wrapWith } from '../utils/wrapWith'; import { TemplateCodegenContext, createTemplateCodegenContext } from './context'; import { generateObjectProperty } from './objectProperty'; import { generateStyleScopedClassReferences } from './styleScopedClasses'; diff --git a/packages/language-core/lib/codegen/template/objectProperty.ts b/packages/language-core/lib/codegen/template/objectProperty.ts index 0bdf9facae..261e645062 100644 --- a/packages/language-core/lib/codegen/template/objectProperty.ts +++ b/packages/language-core/lib/codegen/template/objectProperty.ts @@ -1,8 +1,9 @@ import { camelize } from '@vue/shared'; import type { Code, VueCodeInformation } from '../../types'; -import { combineLastMapping, identifierRegex, wrapWith } from '../utils'; +import { combineLastMapping, identifierRegex } from '../utils'; import { generateCamelized } from '../utils/camelized'; import { generateStringLiteralKey } from '../utils/stringLiteralKey'; +import { wrapWith } from '../utils/wrapWith'; import type { TemplateCodegenContext } from './context'; import type { TemplateCodegenOptions } from './index'; import { generateInterpolation } from './interpolation'; diff --git a/packages/language-core/lib/codegen/template/slotOutlet.ts b/packages/language-core/lib/codegen/template/slotOutlet.ts index e4dfe97936..e39da8c4cf 100644 --- a/packages/language-core/lib/codegen/template/slotOutlet.ts +++ b/packages/language-core/lib/codegen/template/slotOutlet.ts @@ -1,7 +1,8 @@ import * as CompilerDOM from '@vue/compiler-dom'; import type { Code } from '../../types'; import { createVBindShorthandInlayHintInfo } from '../inlayHints'; -import { endOfLine, newLine, wrapWith } from '../utils'; +import { endOfLine, newLine } from '../utils'; +import { wrapWith } from '../utils/wrapWith'; import type { TemplateCodegenContext } from './context'; import { generateElementChildren } from './elementChildren'; import { generateElementProps, generatePropExp } from './elementProps'; diff --git a/packages/language-core/lib/codegen/template/styleScopedClasses.ts b/packages/language-core/lib/codegen/template/styleScopedClasses.ts index 57f27c6c64..c9cdc6c3b3 100644 --- a/packages/language-core/lib/codegen/template/styleScopedClasses.ts +++ b/packages/language-core/lib/codegen/template/styleScopedClasses.ts @@ -4,6 +4,7 @@ import { getNodeText } from '../../parsers/scriptSetupRanges'; import type { Code } from '../../types'; import { endOfLine, normalizeAttributeValue } from '../utils'; import { generateEscaped } from '../utils/escaped'; +import { wrapWith } from '../utils/wrapWith'; import type { TemplateCodegenContext } from './context'; import type { TemplateCodegenOptions } from './index'; @@ -25,29 +26,21 @@ export function* generateStyleScopedClassReferences( } for (const { source, className, offset } of ctx.scopedClasses) { yield `/** @type {__VLS_StyleScopedClasses[`; - yield [ - '', - source, + yield* wrapWith( offset - (withDot ? 1 : 0), - ctx.codeFeatures.navigation, - ]; - yield `'`; - - // fix https://github.com/vuejs/language-tools/issues/4537 - yield* generateEscaped( - className, - source, - offset, - ctx.codeFeatures.navigationAndAdditionalCompletion, - classNameEscapeRegex - ); - yield `'`; - yield [ - '', - source, offset + className.length, + source, ctx.codeFeatures.navigation, - ]; + `'`, + ...generateEscaped( + className, + source, + offset, + ctx.codeFeatures.navigationAndAdditionalCompletion, + classNameEscapeRegex + ), + `'` + ) yield `]} */${endOfLine}`; } } diff --git a/packages/language-core/lib/codegen/template/vSlot.ts b/packages/language-core/lib/codegen/template/vSlot.ts index 11597f4163..974209daf2 100644 --- a/packages/language-core/lib/codegen/template/vSlot.ts +++ b/packages/language-core/lib/codegen/template/vSlot.ts @@ -1,6 +1,7 @@ import * as CompilerDOM from '@vue/compiler-dom'; import type { Code } from '../../types'; -import { collectVars, createTsAst, endOfLine, newLine, wrapWith } from '../utils'; +import { collectVars, createTsAst, endOfLine, newLine } from '../utils'; +import { wrapWith } from '../utils/wrapWith'; import type { TemplateCodegenContext } from './context'; import type { TemplateCodegenOptions } from './index'; import { generateObjectProperty } from './objectProperty'; diff --git a/packages/language-core/lib/codegen/utils/camelized.ts b/packages/language-core/lib/codegen/utils/camelized.ts index 1d8ca4e84a..21c063e114 100644 --- a/packages/language-core/lib/codegen/utils/camelized.ts +++ b/packages/language-core/lib/codegen/utils/camelized.ts @@ -5,9 +5,11 @@ export function* generateCamelized( code: string, source: string, offset: number, - info: VueCodeInformation + features: VueCodeInformation ): Generator { const parts = code.split('-'); + const startCombineOffset = features.__combineOffset ?? 0; + for (let i = 0; i < parts.length; i++) { const part = parts[i]; if (part !== '') { @@ -16,7 +18,7 @@ export function* generateCamelized( part, source, offset, - info, + features, ]; } else { @@ -24,7 +26,7 @@ export function* generateCamelized( capitalize(part), source, offset, - { __combineOffset: i }, + { __combineOffset: startCombineOffset + i }, ]; } } diff --git a/packages/language-core/lib/codegen/utils/escaped.ts b/packages/language-core/lib/codegen/utils/escaped.ts index a726105e05..0c77beec0d 100644 --- a/packages/language-core/lib/codegen/utils/escaped.ts +++ b/packages/language-core/lib/codegen/utils/escaped.ts @@ -8,6 +8,7 @@ export function* generateEscaped( escapeTarget: RegExp ): Generator { const parts = text.split(escapeTarget); + const startCombineOffset = features.__combineOffset ?? 0; let isEscapeTarget = false; for (let i = 0; i < parts.length; i++) { @@ -19,7 +20,7 @@ export function* generateEscaped( part, source, offset, - i === 0 ? features : { __combineOffset: i }, + i === 0 ? features : { __combineOffset: startCombineOffset + i }, ]; offset += part.length; isEscapeTarget = !isEscapeTarget; diff --git a/packages/language-core/lib/codegen/utils/index.ts b/packages/language-core/lib/codegen/utils/index.ts index 0684ef6c3a..89fa2d8f6a 100644 --- a/packages/language-core/lib/codegen/utils/index.ts +++ b/packages/language-core/lib/codegen/utils/index.ts @@ -8,23 +8,6 @@ export const endOfLine = `;${newLine}`; export const combineLastMapping: VueCodeInformation = { __combineOffset: 1 }; export const identifierRegex = /^[a-zA-Z_$][0-9a-zA-Z_$]*$/; -export function* wrapWith( - startOffset: number, - endOffset: number, - features: VueCodeInformation, - ...wrapCodes: Code[] -): Generator { - yield ['', 'template', startOffset, features]; - let offset = 1; - for (const wrapCode of wrapCodes) { - if (typeof wrapCode !== 'string') { - offset++; - } - yield wrapCode; - } - yield ['', 'template', endOffset, { __combineOffset: offset }]; -} - export function collectVars( ts: typeof import('typescript'), node: ts.Node, diff --git a/packages/language-core/lib/codegen/utils/stringLiteralKey.ts b/packages/language-core/lib/codegen/utils/stringLiteralKey.ts index bfeb191ce2..63b14fd593 100644 --- a/packages/language-core/lib/codegen/utils/stringLiteralKey.ts +++ b/packages/language-core/lib/codegen/utils/stringLiteralKey.ts @@ -1,5 +1,6 @@ import type { Code, VueCodeInformation } from '../../types'; -import { combineLastMapping, wrapWith } from './index'; +import { combineLastMapping } from './index'; +import { wrapWith } from './wrapWith'; export function* generateStringLiteralKey(code: string, offset?: number, info?: VueCodeInformation): Generator { if (offset === undefined || !info) { diff --git a/packages/language-core/lib/codegen/utils/unicode.ts b/packages/language-core/lib/codegen/utils/unicode.ts index 6d675aa441..bd44cfdf7d 100644 --- a/packages/language-core/lib/codegen/utils/unicode.ts +++ b/packages/language-core/lib/codegen/utils/unicode.ts @@ -1,5 +1,5 @@ import type { Code, VueCodeInformation } from '../../types'; -import { wrapWith } from './index'; +import { wrapWith } from './wrapWith'; export function* generateUnicode(code: string, offset: number, info: VueCodeInformation): Generator { if (needToUnicode(code)) { diff --git a/packages/language-core/lib/codegen/utils/wrapWith.ts b/packages/language-core/lib/codegen/utils/wrapWith.ts new file mode 100644 index 0000000000..aa62ac4910 --- /dev/null +++ b/packages/language-core/lib/codegen/utils/wrapWith.ts @@ -0,0 +1,42 @@ +import type { Code, VueCodeInformation } from "../../types"; + +export function wrapWith( + startOffset: number, + endOffset: number, + features: VueCodeInformation, + ...codes: Code[] +): Generator; + +export function wrapWith( + startOffset: number, + endOffset: number, + source: string, + features: VueCodeInformation, + ...codes: Code[] +): Generator; + +export function* wrapWith( + startOffset: number, + endOffset: number, + ...args: any[] +): Generator { + let source = 'template'; + let features: VueCodeInformation; + let codes: Code[]; + if (typeof args[0] === 'string') { + [source, features, ...codes] = args; + } + else { + [features, ...codes] = args; + } + + yield ['', source, startOffset, features]; + let offset = 1; + for (const code of codes) { + if (typeof code !== 'string') { + offset++; + } + yield code; + } + yield ['', source, endOffset, { __combineOffset: offset }]; +} From 6eebff5a948b8bdc07911a0125eb238c1f9bd62f Mon Sep 17 00:00:00 2001 From: github-actions <41898282+github-actions[bot]@users.noreply.github.com> Date: Tue, 25 Feb 2025 19:40:09 +0000 Subject: [PATCH 220/345] ci(lint): auto-fix --- .../language-core/lib/codegen/template/styleScopedClasses.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/language-core/lib/codegen/template/styleScopedClasses.ts b/packages/language-core/lib/codegen/template/styleScopedClasses.ts index c9cdc6c3b3..0a50b3b9e1 100644 --- a/packages/language-core/lib/codegen/template/styleScopedClasses.ts +++ b/packages/language-core/lib/codegen/template/styleScopedClasses.ts @@ -40,7 +40,7 @@ export function* generateStyleScopedClassReferences( classNameEscapeRegex ), `'` - ) + ); yield `]} */${endOfLine}`; } } From 27f962709147a6420ba81b23770331231787e121 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=B1=B1=E5=90=B9=E8=89=B2=E5=BE=A1=E5=AE=88?= <85992002+KazariEX@users.noreply.github.com> Date: Wed, 26 Feb 2025 05:11:19 +0800 Subject: [PATCH 221/345] fix(language-core): validate `v-model` variable against model type (#5214) --- .../lib/codegen/template/elementEvents.ts | 69 +++++++++++++++---- .../tsc/passedFixtures/vue3/#4646/child.vue | 12 ++-- .../tsc/passedFixtures/vue3/#4646/child2.vue | 8 ++- .../tsc/passedFixtures/vue3/#4646/parent.vue | 23 ++++--- .../tsc/passedFixtures/vue3/#4822/main.vue | 2 +- .../vue3/defineModelModifiers/main.vue | 2 +- 6 files changed, 80 insertions(+), 36 deletions(-) diff --git a/packages/language-core/lib/codegen/template/elementEvents.ts b/packages/language-core/lib/codegen/template/elementEvents.ts index 7e2455bbb7..2a7348045c 100644 --- a/packages/language-core/lib/codegen/template/elementEvents.ts +++ b/packages/language-core/lib/codegen/template/elementEvents.ts @@ -20,13 +20,17 @@ export function* generateElementEvents( let emitVar: string | undefined; let eventsVar: string | undefined; let propsVar: string | undefined; + for (const prop of node.props) { if ( prop.type === CompilerDOM.NodeTypes.DIRECTIVE - && prop.name === 'on' - && prop.arg?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION - && !prop.arg.loc.source.startsWith('[') - && !prop.arg.loc.source.endsWith(']') + && ( + prop.name === 'model' + || prop.name === 'on' + && prop.arg?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION + && !prop.arg.loc.source.startsWith('[') + && !prop.arg.loc.source.endsWith(']') + ) ) { ctx.currentComponent!.used = true; if (!emitVar) { @@ -37,21 +41,33 @@ export function* generateElementEvents( yield `let ${eventsVar}!: __VLS_NormalizeEmits${endOfLine}`; yield `let ${propsVar}!: __VLS_FunctionalComponentProps${endOfLine}`; } - let source = prop.arg.loc.source; - let start = prop.arg.loc.start.offset; - let propPrefix = 'on'; + + let source = prop.arg?.loc.source ?? 'model-value'; + let start = prop.arg?.loc.start.offset; + let propPrefix = 'on-'; let emitPrefix = ''; - if (source.startsWith('vue:')) { + if (prop.name === 'model') { + propPrefix = 'onUpdate:'; + emitPrefix = 'update:'; + } + else if (source.startsWith('vue:')) { source = source.slice('vue:'.length); - start = start + 'vue:'.length; - propPrefix = 'onVnode'; + start = start! + 'vue:'.length; + propPrefix = 'onVnode-'; emitPrefix = 'vnode-'; } - yield `const ${ctx.getInternalVariable()}: __VLS_NormalizeComponentEvent = {${newLine}`; - yield* generateEventArg(ctx, source, start, propPrefix); - yield `: `; - yield* generateEventExpression(options, ctx, prop); - yield `}${endOfLine}`; + + yield `(): __VLS_NormalizeComponentEvent => ({${newLine}`; + if (prop.name === 'on') { + yield* generateEventArg(ctx, source, start!, propPrefix.slice(0, -1)); + yield `: `; + yield* generateEventExpression(options, ctx, prop); + } + else { + yield `'${camelize(propPrefix + source)}': `; + yield* generateModelEventExpression(options, ctx, prop); + } + yield `})${endOfLine}`; } } } @@ -159,6 +175,29 @@ export function* generateEventExpression( } } +export function* generateModelEventExpression( + options: TemplateCodegenOptions, + ctx: TemplateCodegenContext, + prop: CompilerDOM.DirectiveNode +): Generator { + if (prop.exp?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION) { + yield `(...[$event]) => (`; + yield* generateInterpolation( + options, + ctx, + 'template', + ctx.codeFeatures.verification, + prop.exp.content, + prop.exp.loc.start.offset, + prop.exp.loc + ) + yield ` = $event)`; + } + else { + yield `() => {}`; + } +} + export function isCompoundExpression(ts: typeof import('typescript'), ast: ts.SourceFile) { let result = true; if (ast.statements.length === 0) { diff --git a/test-workspace/tsc/passedFixtures/vue3/#4646/child.vue b/test-workspace/tsc/passedFixtures/vue3/#4646/child.vue index c5d5b5c1b4..3383be25ec 100644 --- a/test-workspace/tsc/passedFixtures/vue3/#4646/child.vue +++ b/test-workspace/tsc/passedFixtures/vue3/#4646/child.vue @@ -1,13 +1,15 @@ - - + + diff --git a/test-workspace/tsc/passedFixtures/vue3/#4646/child2.vue b/test-workspace/tsc/passedFixtures/vue3/#4646/child2.vue index 3c9de244f0..481e6ca147 100644 --- a/test-workspace/tsc/passedFixtures/vue3/#4646/child2.vue +++ b/test-workspace/tsc/passedFixtures/vue3/#4646/child2.vue @@ -1,5 +1,7 @@ - - + + diff --git a/test-workspace/tsc/passedFixtures/vue3/#4646/parent.vue b/test-workspace/tsc/passedFixtures/vue3/#4646/parent.vue index 162862da20..38b59cfc7d 100644 --- a/test-workspace/tsc/passedFixtures/vue3/#4646/parent.vue +++ b/test-workspace/tsc/passedFixtures/vue3/#4646/parent.vue @@ -1,15 +1,16 @@ - + + diff --git a/test-workspace/tsc/passedFixtures/vue3/#4822/main.vue b/test-workspace/tsc/passedFixtures/vue3/#4822/main.vue index c6f1e69582..2b77561b60 100644 --- a/test-workspace/tsc/passedFixtures/vue3/#4822/main.vue +++ b/test-workspace/tsc/passedFixtures/vue3/#4822/main.vue @@ -11,7 +11,7 @@ export default defineComponent({