From 92ee575a998d96002c77952933dbef6cb87e8850 Mon Sep 17 00:00:00 2001 From: Simon Holthausen Date: Wed, 5 May 2021 09:29:55 +0200 Subject: [PATCH] (feat) use setting instead of command for toggling ts plugin A command would need to be reentered every time an extension update happens --- packages/svelte-vscode/README.md | 4 ++ packages/svelte-vscode/package.json | 10 ++-- packages/svelte-vscode/src/extension.ts | 72 ++++++------------------ packages/svelte-vscode/src/tsplugin.ts | 73 +++++++++++++++++++++++++ 4 files changed, 99 insertions(+), 60 deletions(-) create mode 100644 packages/svelte-vscode/src/tsplugin.ts diff --git a/packages/svelte-vscode/README.md b/packages/svelte-vscode/README.md index 9a6efbd66..e6988692e 100644 --- a/packages/svelte-vscode/README.md +++ b/packages/svelte-vscode/README.md @@ -59,6 +59,10 @@ More docs and troubleshooting: [See here](/docs/README.md). ### Settings +##### `svelte.enable-ts-plugin` + +Enables a TypeScript plugin which provides intellisense for Svelte files inside TS/JS files. _Default_: `false` + ##### `svelte.language-server.runtime` Path to the node executable you would like to use to run the language server. diff --git a/packages/svelte-vscode/package.json b/packages/svelte-vscode/package.json index 6972eea96..c2785fc77 100644 --- a/packages/svelte-vscode/package.json +++ b/packages/svelte-vscode/package.json @@ -54,6 +54,12 @@ "type": "object", "title": "Svelte", "properties": { + "svelte.enable-ts-plugin": { + "type": "boolean", + "default": false, + "title": "Enable TypeScript Svelte plugin", + "description": "Enables a TypeScript plugin which provides intellisense for Svelte files inside TS/JS files." + }, "svelte.language-server.runtime": { "scope": "application", "type": "string", @@ -478,10 +484,6 @@ { "command": "svelte.extractComponent", "title": "Svelte: Extract Component" - }, - { - "command": "svelte.toggleTsPlugin", - "title": "Svelte: Toggle TS Plugin" } ], "menus": { diff --git a/packages/svelte-vscode/src/extension.ts b/packages/svelte-vscode/src/extension.ts index d2cb66de0..dbbd2ed9d 100644 --- a/packages/svelte-vscode/src/extension.ts +++ b/packages/svelte-vscode/src/extension.ts @@ -1,34 +1,34 @@ +import * as path from 'path'; import { - workspace, + commands, ExtensionContext, - TextDocument, + extensions, + IndentAction, + languages, Position, + ProgressLocation, Range, - commands, - window, - WorkspaceEdit, + TextDocument, Uri, - ProgressLocation, ViewColumn, - languages, - IndentAction, - extensions + window, + workspace, + WorkspaceEdit } from 'vscode'; import { + ExecuteCommandRequest, LanguageClientOptions, - TextDocumentPositionParams, RequestType, RevealOutputChannelOn, - WorkspaceEdit as LSWorkspaceEdit, TextDocumentEdit, - ExecuteCommandRequest + TextDocumentPositionParams, + WorkspaceEdit as LSWorkspaceEdit } from 'vscode-languageclient'; import { LanguageClient, ServerOptions, TransportKind } from 'vscode-languageclient/node'; +import CompiledCodeContentProvider from './CompiledCodeContentProvider'; 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'; +import { TsPlugin } from './tsplugin'; namespace TagCloseRequest { export const type: RequestType = new RequestType( @@ -173,7 +173,7 @@ export function activate(context: ExtensionContext) { addExtracComponentCommand(getLS, context); - context.subscriptions.push(commands.registerCommand('svelte.toggleTsPlugin', toggleTsPlugin)); + TsPlugin.create(context); languages.setLanguageConfiguration('svelte', { indentationRules: { @@ -387,46 +387,6 @@ 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); } diff --git a/packages/svelte-vscode/src/tsplugin.ts b/packages/svelte-vscode/src/tsplugin.ts new file mode 100644 index 000000000..8e989192a --- /dev/null +++ b/packages/svelte-vscode/src/tsplugin.ts @@ -0,0 +1,73 @@ +import { readFileSync, writeFileSync } from 'fs'; +import { join } from 'path'; +import { commands, ExtensionContext, extensions, window, workspace } from 'vscode'; + +export class TsPlugin { + private enabled: boolean; + + static create(context: ExtensionContext) { + new TsPlugin(context); + } + + private constructor(context: ExtensionContext) { + this.enabled = this.getEnabledState(); + this.toggleTsPlugin(this.enabled); + + context.subscriptions.push( + workspace.onDidChangeConfiguration(() => { + const enabled = this.getEnabledState(); + if (enabled !== this.enabled) { + this.enabled = enabled; + this.toggleTsPlugin(this.enabled); + } + }) + ); + } + + private getEnabledState(): boolean { + return workspace.getConfiguration('svelte').get('enable-ts-plugin') ?? false; + } + + private toggleTsPlugin(enable: boolean) { + const extension = extensions.getExtension('svelte.svelte-vscode'); + if (!extension) { + // This shouldn't be possible + return; + } + + const packageJson = join(extension.extensionPath, 'package.json'); + const enabled = '"typescriptServerPlugins"'; + const disabled = '"typescriptServerPlugins-disabled"'; + try { + const packageText = readFileSync(packageJson, 'utf8'); + if (packageText.includes(disabled) && enable) { + const newText = packageText.replace(disabled, enabled); + writeFileSync(packageJson, newText, 'utf8'); + this.showReload(true); + } else if (packageText.includes(enabled) && !enable) { + const newText = packageText.replace(enabled, disabled); + writeFileSync(packageJson, newText, 'utf8'); + this.showReload(false); + } else if (!packageText.includes(enabled) && !packageText.includes(disabled)) { + window.showWarningMessage('Unknown Svelte for VS Code package.json status.'); + } + } catch (err) { + window.showWarningMessage( + 'Svelte for VS Code package.json update failed, TypeScript plugin could not be toggled.' + ); + } + } + + private async showReload(enabled: boolean) { + // Restarting the TSServer via a commend isn't enough, the whole VS Code window needs to reload + 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'); + } + } +}