SvelteLab
SvelteLab copied to clipboard
[WIP] Svelte Language Server integration
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 asrc/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 typeRecord<PathToFile (string), FileContents (string)>
(https://github.com/SvelteLab/SvelteLab/pull/277/files#diff-54c3b6b7253ed4f41dd02429026ab0da5c356c4941d071771717557fa4078249R851-R879) - Extends
get_tree
withignore_node_modules
parameter