Skip to content

Comments

feat: migrate to Volar#2242

Draft
johnsoncodehk wants to merge 22 commits intosveltejs:masterfrom
johnsoncodehk:volar2
Draft

feat: migrate to Volar#2242
johnsoncodehk wants to merge 22 commits intosveltejs:masterfrom
johnsoncodehk:volar2

Conversation

@johnsoncodehk
Copy link

@johnsoncodehk johnsoncodehk commented Dec 27, 2023

This is the initial implementation of integrating Volar with svelte2tsx. We have revamped svelte-language-server, svelte-check (based-on astro-check), svelte-vscode, typescript-svelte-plugin using the Volar toolkit.

The existing svelte-specific features in the repository still need to be implemented by maintainers based on the Volar ServicePlugin API. (We have coordinated with the maintainers of svelte language tools, so if you have any questions, feel free to reach out to us on Discord!)

For debugging, you can now use Volar Labs for more visualization features:

螢幕截圖 2023-12-27 下午4 47 56

@orta
Copy link
Contributor

orta commented Jan 23, 2024

wow this is wild

@MathiasWP
Copy link
Contributor

What's the performance of this setup compared to the current one?

- Resolved conflicts by keeping Volar architecture changes
- Updated node engine requirement to >= 18.0.0
- Kept Volar-based implementations for language-server, svelte-check, svelte-vscode, and typescript-plugin
- Add svelteService.ts with Svelte template completions and hover support
  - Block tag completions ({#if}, {#each}, {#await}, {#key}, {#snippet})
  - Continuation tags ({:else}, {:then}, {:catch})
  - Closing tags ({/if}, {/each}, etc.)
  - Special tags ({@html}, {@debug}, {@const}, {@render}, {@Attach})
  - Event modifier completions (preventDefault, stopPropagation, etc.)
  - @component documentation completion
  - Hover information for Svelte tags
- Update index.ts to include Svelte service plugin
- Add @volar/language-service dependency
- Fix ESM compatibility in svelte-check bin
- Remove conflicting files from upstream merge that don't fit Volar architecture
- Update tsconfig.json to include all packages in build
- Keep original workflow files (no workflow changes)
@changeset-bot
Copy link

changeset-bot bot commented Jan 31, 2026

⚠️ No Changeset found

Latest commit: 0b8d552

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

Port the battle-tested hack from Vue Language Tools that patches the
built-in TypeScript extension to recognize .svelte files.

This enables:
- Auto imports from .svelte files in .ts/.js files
- Go to definition from .ts/.js to .svelte files
- Better TypeScript plugin integration
- Proper language mode recognition for Svelte files

The hack intercepts fs.readFileSync to modify the TypeScript extension's
JavaScript code at load time, adding 'svelte' to the list of supported
languages in several key places:
- jsTsLanguageModes
- isSupportedLanguageMode
- isTypeScriptDocument
- Plugin sorting for compatibility
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants