feat(vscode): support for disabling typescript plugin (#4226)

extensions/vscode/package.json

@@ -224,9 +224,16 @@
 					"default": "auto",
 					"enum": [
 						"auto",
+						"typeScriptPluginOnly",
 						true,
 						false
 					],
+					"enumDescriptions": [
+						"Automatically detect and enable TypeScript Plugin/Hybrid Mode in a safe environment.",
+						"Only enable Vue TypeScript Plugin but disable Hybrid Mode.",
+						"Enable TypeScript Plugin/Hybrid Mode.",
+						"Disable TypeScript Plugin/Hybrid Mode."
+					],
 					"description": "Vue language server only handles CSS and HTML language support, and tsserver takes over TS language support via TS plugin."
 				},
 				"vue.server.maxFileSize": {

extensions/vscode/src/common.ts

@@ -37,12 +37,21 @@ export async function activate(context: vscode.ExtensionContext, createLc: Creat
 	}
 }
 
-export const currentHybridModeStatus = getCurrentHybridModeStatus();
+export const enabledHybridMode = getCurrentHybridModeStatus();
 
-vscode.commands.executeCommand('setContext', 'vueHybridMode', currentHybridModeStatus);
+export const enabledTypeScriptPlugin = getCurrentTypeScriptPluginStatus(enabledHybridMode);
+
+vscode.commands.executeCommand('setContext', 'vueHybridMode', enabledHybridMode);
+
+function getCurrentTypeScriptPluginStatus(enabledHybridMode: boolean) {
+	return enabledHybridMode || config.server.hybridMode === 'typeScriptPluginOnly';
+}
 
 function getCurrentHybridModeStatus(report = false) {
-	if (config.server.hybridMode === 'auto') {
+	if (config.server.hybridMode === 'typeScriptPluginOnly') {
+		return false;
+	}
+	else if (config.server.hybridMode === 'auto') {
 		const unknownExtensions: string[] = [];
 		for (const extension of vscode.extensions.all) {
 			const hasTsPlugin = !!extension.packageJSON?.contributes?.typescriptServerPlugins;
@@ -170,7 +179,7 @@ async function doActivate(context: vscode.ExtensionContext, createLc: CreateLang
 		'vue',
 		'Vue',
 		getDocumentSelector(),
-		await getInitializationOptions(context, currentHybridModeStatus),
+		await getInitializationOptions(context, enabledHybridMode),
 		6009,
 		outputChannel
 	);
@@ -196,21 +205,21 @@ async function doActivate(context: vscode.ExtensionContext, createLc: CreateLang
 	lsp.activateWriteVirtualFiles('vue.action.writeVirtualFiles', client);
 	lsp.activateServerSys(client);
 
-	if (!currentHybridModeStatus) {
+	if (!enabledHybridMode) {
 		lsp.activateTsConfigStatusItem(selectors, 'vue.tsconfig', client);
 		lsp.activateTsVersionStatusItem(selectors, 'vue.tsversion', context, client, text => 'TS ' + text);
 		lsp.activateFindFileReferences('vue.findAllFileReferences', client);
 	}
 
 	const hybridModeStatus = vscode.languages.createLanguageStatusItem('vue-hybrid-mode', selectors);
 	hybridModeStatus.text = 'Hybrid Mode';
-	hybridModeStatus.detail = (currentHybridModeStatus ? 'Enabled' : 'Disabled') + (config.server.hybridMode === 'auto' ? ' (Auto)' : '');
+	hybridModeStatus.detail = (enabledHybridMode ? 'Enabled' : 'Disabled') + (config.server.hybridMode === 'auto' ? ' (Auto)' : '');
 	hybridModeStatus.command = {
 		title: 'Open Setting',
 		command: 'workbench.action.openSettings',
 		arguments: ['vue.server.hybridMode'],
 	};
-	if (!currentHybridModeStatus) {
+	if (!enabledHybridMode) {
 		hybridModeStatus.severity = vscode.LanguageStatusSeverity.Warning;
 	}
 
@@ -248,14 +257,22 @@ async function doActivate(context: vscode.ExtensionContext, createLc: CreateLang
 	function activateConfigWatcher() {
 		context.subscriptions.push(vscode.workspace.onDidChangeConfiguration(e => {
 			if (e.affectsConfiguration('vue.server.hybridMode')) {
-				const newStatus = getCurrentHybridModeStatus();
-				if (newStatus !== currentHybridModeStatus) {
+				const newHybridModeStatus = getCurrentHybridModeStatus();
+				const newTypeScriptPluginStatus = getCurrentTypeScriptPluginStatus(newHybridModeStatus);
+				if (newHybridModeStatus !== enabledHybridMode) {
 					requestReloadVscode(
-						newStatus
+						newHybridModeStatus
 							? 'Please reload VSCode to enable Hybrid Mode.'
 							: 'Please reload VSCode to disable Hybrid Mode.'
 					);
 				}
+				else if (newTypeScriptPluginStatus !== enabledTypeScriptPlugin) {
+					requestReloadVscode(
+						newTypeScriptPluginStatus
+							? 'Please reload VSCode to enable Vue TypeScript Plugin.'
+							: 'Please reload VSCode to disable Vue TypeScript Plugin.'
+					);
+				}
 			}
 			else if (e.affectsConfiguration('vue')) {
 				vscode.commands.executeCommand('vue.action.restartServer', false);
@@ -267,7 +284,7 @@ async function doActivate(context: vscode.ExtensionContext, createLc: CreateLang
 		context.subscriptions.push(vscode.commands.registerCommand('vue.action.restartServer', async (restartTsServer: boolean = true) => {
 			await client.stop();
 			outputChannel.clear();
-			client.clientOptions.initializationOptions = await getInitializationOptions(context, currentHybridModeStatus);
+			client.clientOptions.initializationOptions = await getInitializationOptions(context, enabledHybridMode);
 			await client.start();
 			nameCasing.activate(context, client, selectors);
 			if (restartTsServer) {

extensions/vscode/src/config.ts

@@ -16,7 +16,7 @@ export const config = {
 		return _config().get('doctor')!;
 	},
 	get server(): Readonly<{
-		hybridMode: 'auto' | boolean;
+		hybridMode: 'auto' | 'typeScriptPluginOnly' | boolean;
 		maxOldSpaceSize: number;
 		maxFileSize: number;
 		diagnosticModel: 'push' | 'pull';

extensions/vscode/src/nodeClientMain.ts

@@ -3,7 +3,7 @@ import * as serverLib from '@vue/language-server';
 import * as fs from 'fs';
 import * as vscode from 'vscode';
 import * as lsp from '@volar/vscode/node';
-import { activate as commonActivate, deactivate as commonDeactivate, currentHybridModeStatus } from './common';
+import { activate as commonActivate, deactivate as commonDeactivate, enabledHybridMode, enabledTypeScriptPlugin } from './common';
 import { config } from './config';
 import { middleware } from './middleware';
 
@@ -140,7 +140,13 @@ try {
 			// @ts-expect-error
 			let text = readFileSync(...args) as string;
 
-			if (!currentHybridModeStatus) {
+			if (!enabledTypeScriptPlugin) {
+				text = text.replace(
+					'for(const e of n.contributes.typescriptServerPlugins',
+					s => s + `.filter(p=>p.name!=='typescript-vue-plugin-bundle')`
+				);
+			}
+			else if (!enabledHybridMode) {
 				// patch readPlugins
 				text = text.replace(
 					'languages:Array.isArray(e.languages)',