(feat) add TS plugin toggle to extension (#980)

Author: dummdidumm

packages/svelte-vscode/package.json

@@ -44,6 +44,12 @@
         "onCommand:svelte.restartLanguageServer"
     ],
     "contributes": {
+        "typescriptServerPlugins-disabled": [
+            {
+                "name": "typescript-svelte-plugin",
+                "enableForWorkspaceTypeScriptVersions": true
+            }
+        ],
         "configuration": {
             "type": "object",
             "title": "Svelte",
@@ -472,6 +478,10 @@
             {
                 "command": "svelte.extractComponent",
                 "title": "Svelte: Extract Component"
+            },
+            {
+                "command": "svelte.toggleTsPlugin",
+                "title": "Svelte: Toggle TS Plugin"
             }
         ],
         "menus": {
@@ -513,6 +523,7 @@
     "dependencies": {
         "lodash": "^4.17.19",
         "svelte-language-server": "*",
-        "vscode-languageclient": "^7.0.0"
+        "vscode-languageclient": "^7.0.0",
+        "typescript-svelte-plugin": "*"
     }
 }

packages/svelte-vscode/src/extension.ts

@@ -28,6 +28,7 @@ import { activateTagClosing } from './html/autoClose';
 import { EMPTY_ELEMENTS } from './html/htmlEmptyTagsShared';
 import CompiledCodeContentProvider from './CompiledCodeContentProvider';
 import * as path from 'path';
+import { readFileSync, writeFileSync } from 'fs';
 
 namespace TagCloseRequest {
     export const type: RequestType<TextDocumentPositionParams, string, any> = new RequestType(
@@ -172,6 +173,8 @@ export function activate(context: ExtensionContext) {
 
     addExtracComponentCommand(getLS, context);
 
+    context.subscriptions.push(commands.registerCommand('svelte.toggleTsPlugin', toggleTsPlugin));
+
     languages.setLanguageConfiguration('svelte', {
         indentationRules: {
             // Matches a valid opening tag that is:
@@ -384,6 +387,46 @@ function addExtracComponentCommand(getLS: () => LanguageClient, context: Extensi
     );
 }
 
+function toggleTsPlugin() {
+    const extension = extensions.getExtension('svelte.svelte-vscode');
+    if (!extension) {
+        // This shouldn't be possible
+        return;
+    }
+
+    const packageJson = path.join(extension.extensionPath, 'package.json');
+    const enabled = '"typescriptServerPlugins"';
+    const disabled = '"typescriptServerPlugins-disabled"';
+    try {
+        const packageText = readFileSync(packageJson, 'utf8');
+        if (packageText.includes(disabled)) {
+            const newText = packageText.replace(disabled, enabled);
+            writeFileSync(packageJson, newText, 'utf8');
+            showReload(true);
+        } else if (packageText.includes(enabled)) {
+            const newText = packageText.replace(enabled, disabled);
+            writeFileSync(packageJson, newText, 'utf8');
+            showReload(false);
+        } else {
+            window.showWarningMessage('Unknown Svelte for VS Code package.json status.');
+        }
+    } catch (err) {
+        window.showWarningMessage('Svelte for VS Code package.json update failed.');
+    }
+
+    async function showReload(enabled: boolean) {
+        const reload = await window.showInformationMessage(
+            ` TypeScript Svelte Plugin ${
+                enabled ? 'enabled' : 'disabled'
+            }, please reload VS Code to restart the TS Server.`,
+            'Reload Window'
+        );
+        if (reload) {
+            commands.executeCommand('workbench.action.reloadWindow');
+        }
+    }
+}
+
 function createLanguageServer(serverOptions: ServerOptions, clientOptions: LanguageClientOptions) {
     return new LanguageClient('svelte', 'Svelte', serverOptions, clientOptions);
 }