feat(language-core): add checkUnknownDirectives option (#5141)

Author: KazariEX

packages/language-core/lib/codegen/script/scriptSetup.ts

@@ -5,7 +5,7 @@ import { combineLastMapping, endOfLine, generateSfcBlockSection, newLine } from
 import { generateComponent, generateEmitsOption } from './component';
 import { generateComponentSelf } from './componentSelf';
 import type { ScriptCodegenContext } from './context';
-import { ScriptCodegenOptions, generateScriptSectionPartiallyEnding } from './index';
+import { type ScriptCodegenOptions, generateScriptSectionPartiallyEnding } from './index';
 import { generateTemplate } from './template';
 
 export function* generateScriptSetupImports(

packages/language-core/lib/codegen/template/context.ts

@@ -35,7 +35,7 @@ export function createTemplateCodegenContext(options: Pick<TemplateCodegenOption
 						shouldReport: () => {
 							token.errors++;
 							return false;
-						}
+						},
 					},
 				};
 			}

packages/language-core/lib/codegen/template/elementDirectives.ts

@@ -2,6 +2,7 @@ import * as CompilerDOM from '@vue/compiler-dom';
 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 { generateCamelized } from '../utils/camelized';
 import { generateStringLiteralKey } from '../utils/stringLiteralKey';
@@ -10,6 +11,15 @@ import type { TemplateCodegenOptions } from './index';
 import { generateInterpolation } from './interpolation';
 import { generateObjectProperty } from './objectProperty';
 
+const builtInDirectives = new Set([
+	'cloak',
+	'html',
+	'memo',
+	'once',
+	'show',
+	'text',
+]);
+
 export function* generateElementDirectives(
 	options: TemplateCodegenOptions,
 	ctx: TemplateCodegenContext,
@@ -34,7 +44,7 @@ export function* generateElementDirectives(
 			prop.loc.end.offset,
 			ctx.codeFeatures.verification,
 			`__VLS_asFunctionalDirective(`,
-			...generateIdentifier(ctx, prop),
+			...generateIdentifier(options, ctx, prop),
 			`)(null!, { ...__VLS_directiveBindingRestFields, `,
 			...generateArg(options, ctx, prop),
 			...generateModifiers(options, ctx, prop),
@@ -46,6 +56,7 @@ export function* generateElementDirectives(
 }
 
 function* generateIdentifier(
+	options: TemplateCodegenOptions,
 	ctx: TemplateCodegenContext,
 	prop: CompilerDOM.DirectiveNode
 ): Generator<Code> {
@@ -58,16 +69,16 @@ function* generateIdentifier(
 		...generateCamelized(
 			rawName,
 			prop.loc.start.offset,
-			{
-				...ctx.codeFeatures.withoutHighlight,
+			ctx.resolveCodeFeatures({
+				...codeFeatures.withoutHighlight,
 				// fix https://github.com/vuejs/language-tools/issues/1905
-				...ctx.codeFeatures.additionalCompletion,
-				verification: false,
+				...codeFeatures.additionalCompletion,
+				verification: options.vueCompilerOptions.checkUnknownDirectives && !builtInDirectives.has(prop.name),
 				navigation: {
 					resolveRenameNewName: camelize,
 					resolveRenameEditText: getPropRenameApply(prop.name),
 				},
-			}
+			})
 		)
 	);
 }

packages/language-core/lib/types.ts

@@ -31,6 +31,7 @@ export interface VueCompilerOptions {
 	jsxSlots: boolean;
 	checkUnknownProps: boolean;
 	checkUnknownEvents: boolean;
+	checkUnknownDirectives: boolean;
 	checkUnknownComponents: boolean;
 	skipTemplateCodegen: boolean;
 	fallthroughAttributes: boolean;

packages/language-core/lib/utils/ts.ts

@@ -264,6 +264,7 @@ export function getDefaultCompilerOptions(target = 99, lib = 'vue', strictTempla
 		jsxSlots: false,
 		checkUnknownProps: strictTemplates,
 		checkUnknownEvents: strictTemplates,
+		checkUnknownDirectives: strictTemplates,
 		checkUnknownComponents: strictTemplates,
 		skipTemplateCodegen: false,
 		fallthroughAttributes: false,

packages/language-core/schemas/vue-tsconfig.schema.json

@@ -55,6 +55,11 @@
 					"default": false,
 					"markdownDescription": "Check unknown events. If not set, uses the 'strictTemplates' value."
 				},
+				"checkUnknownDirectives": {
+					"type": "boolean",
+					"default": false,
+					"markdownDescription": "Check unknown directives. If not set, uses the 'strictTemplates' value."
+				},
 				"checkUnknownComponents": {
 					"type": "boolean",
 					"default": false,