SvelteLab icon indicating copy to clipboard operation
SvelteLab copied to clipboard

[WIP] Svelte Language Server integration

Open snuffyDev opened this issue 2 years ago • 6 comments

Adds (nearly) full & complete Svelte Language Server + TypeScript/JavaScript language server support for compatible browsers.

Features include:

  • Intellisense for Svelte & TypeScript/JavaScript
    • Import completions/suggestions
    • Cross-module intellisense
    • Hover tooltips (similar to VSCode's hover tooltips, complete with MDN links for CSS, for example)
    • Support for SvelteKit's "Virtual Modules" (export let data should provide correct types, for example)
    • Support for NPM package type intellisense
    • Tooltips for any errors (like in VSCode)
    • ... and much more!

Code changes

Components

  • Adds LanguageClientProvider.svelte, which encapsulates access to the language server functionality (since everything is instantiated async, plus, we need to limit access to it due to the use of Web Workers)
  • Extends FileTree.svelte to support updating/adding files to the language servers (https://github.com/SvelteLab/SvelteLab/pull/277/files#diff-4fc96a12a94550fd4403144a0bd814c3dadf0b0c2c59d00df88c80bcd28ce3daR44-R64)

webcontainer.ts

  • Extends FSChangedEvent to have be of type 'creation' | 'deletion' | 'modification' (https://github.com/SvelteLab/SvelteLab/pull/277/files#diff-54c3b6b7253ed4f41dd02429026ab0da5c356c4941d071771717557fa4078249R105)
    • Any modifications will get written to the files store (used by the SvelteLab 'frontend'), which will get sent to the language workers (https://github.com/SvelteLab/SvelteLab/pull/277/files#diff-54c3b6b7253ed4f41dd02429026ab0da5c356c4941d071771717557fa4078249R147-R153)
  • Improves UX for template/project loading by finding at least the first *.svelte file. Vite templates aren't normally going to have a src/routes/+page.svelte file, so we might as well meet the normal expectation presented to users when they open the app for the first time (https://github.com/SvelteLab/SvelteLab/pull/277/files#diff-54c3b6b7253ed4f41dd02429026ab0da5c356c4941d071771717557fa4078249R601-R604)
    • To facilitate this feature, a module-local function was added here (https://github.com/SvelteLab/SvelteLab/pull/277/files#diff-54c3b6b7253ed4f41dd02429026ab0da5c356c4941d071771717557fa4078249R881-R906)
  • Adds get_directory_names, afaict it's currently unused, however it might be a nicety later down the line -- although it's up to SvelteLab's maintainers if they want to keep this or not (https://github.com/SvelteLab/SvelteLab/pull/277/files#diff-54c3b6b7253ed4f41dd02429026ab0da5c356c4941d071771717557fa4078249R819-R840)
  • Adds walk_tree_and_collect, which will walk a given file tree and return the type Record<PathToFile (string), FileContents (string)> (https://github.com/SvelteLab/SvelteLab/pull/277/files#diff-54c3b6b7253ed4f41dd02429026ab0da5c356c4941d071771717557fa4078249R851-R879)
  • Extends get_tree with ignore_node_modules parameter

snuffyDev avatar Aug 18 '23 23:08 snuffyDev

Someone is attempting to deploy a commit to a Personal Account owned by @SvelteLab on Vercel.

@SvelteLab first needs to authorize it.

vercel[bot] avatar Aug 18 '23 23:08 vercel[bot]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
sveltelab ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 30, 2023 4:56pm
1 Ignored Deployment
Name Status Preview Comments Updated (UTC)
sveltelab-docs ⬜️ Ignored (Inspect) Visit Preview Oct 30, 2023 4:56pm

vercel[bot] avatar Aug 18 '23 23:08 vercel[bot]

First of all, thank you so much for all the time and effort you have poured into this project! It's amazing to see all the Language Server features like hover type definitions and import completion in SvelteLab 🚀

I've sent the preview deployment link to subscribers in the Discord. Feel free to also join :)

I've only had a quick peek at the PR for now and left some nitpicky comments for the low-hanging fruit. It'll take me a bit to read it fully and probably more to understand the implementation.

Also, I'm having trouble reliably opening the Editor. It often seems to hang or maybe it just takes a really long time to load??? 🤷

EDIT: ok its not loading i think it boots, installs deps, runs vite but the editor doesn't open, at least with ?t=typescript

EDIT EDIT: now it works?! it's kinda weird? 👀

@SarcevicAntonio What browser (and version), along with OS and maybe device/hardware youre running on, is having difficulties?

If you're able to potentially provide me with at minimum browser + version, and some extensions you have installed (if any) I can probably repro and get it fixed before the end of the weekend :rocket:

snuffyDev avatar Oct 28 '23 01:10 snuffyDev

At the current moment, I don't seem to be having any issues on Edge v118.0.2088.61 with the following extensions:

image image image

And no issues with the latest Firefox, no extensions installed :thinking:

snuffyDev avatar Oct 28 '23 02:10 snuffyDev

Any updates here boys?

TKDev7 avatar Oct 06 '24 05:10 TKDev7

Any updates here boys?

I started working on a different version and I almost got it working locally...I need to find a bit of time to continue working on this

paoloricciuti avatar Oct 06 '24 10:10 paoloricciuti