Language Server Protocol

[rburnham52]

Have you thought about using LSP integration for a more unified language support across IDE's? https://microsoft.github.io/language-server-protocol/

IT seems like this should be possible with this client library https://github.com/ballerina-platform/lsp4intellij

and the existing Language server that VS Code uses. https://github.com/UnwrittenFun/svelte-language-server

If the svelte compiler ran off this it would be a unifying experience.

[tomblachut]

Hey, I'd like to integrate with LSP of course, but it's further down the roadmap.

There's also this library: https://github.com/gtache/intellij-lsp IDK which one of them is better

[rburnham52]

I'm tempted to learn a bit more about it to see if i can help out

[tomblachut]

That would be great! Be sure to share your findings, links etc. Thanks.

[bdpartridge]

Looks like the official Svelte Language Server is starting to take shape: https://github.com/sveltejs/language-tools

[Yahatix]

Official Svelte Language Server is now Stable and Production Ready https://github.com/sveltejs/language-tools/releases/tag/100.0.2

[sonyseng]

Out of curiosity, I checked out the svelte language server and as an experiment wanted to see if the ballerina intellij lsp client sort of works. I finally got it to build the other day but the language server crashes often. I get some hover information and red underline errors and a few other things but not much else. If you're curious, and want to try, the instructions on the ballerina page are helpful This is my first time with Kotlin and first time writing an intellij plugin so forgive the code. Here's how I got it to work:

• First install the svelte language server globally: $ npm i -g svelte-language-server
• Point RawCommandServerDefinition to the server.js and run it using stdio. I implemented it in PreloadingActivity
• Modify plugin.xml to hook into the plugin extension points and actions

class TestPreloadingActivity : PreloadingActivity() {
    override fun preload(indicator: ProgressIndicator) {
        val command = arrayOf("node", "/usr/local/lib/node_modules/svelte-language-server/bin/server.js", "--stdio")
        IntellijLanguageClient.addServerDefinition(RawCommandServerDefinition("js,ts,svelte", command))
    }
}

<extensions defaultExtensionNs="com.intellij">
        <preloadingActivity implementation="com.github.sonyseng.intellijtestplugin.services.TestPreloadingActivity"
                            id="com.github.sonyseng.intellijtestplugin.services.TestPreloadingActivity" />
    </extensions>

    <application-components>
        <component>
            <implementation-class>org.wso2.lsp4intellij.IntellijLanguageClient</implementation-class>
        </component>
    </application-components>
    <extensions defaultExtensionNs="com.intellij">
        <completion.contributor implementationClass="org.wso2.lsp4intellij.contributors.LSPCompletionContributor"
                                id="LSPCompletionContributor" language="any"/>
    </extensions>

<actions>
        <action class="org.wso2.lsp4intellij.actions.LSPReformatAction" id="ReformatCode" use-shortcut-of="ReformatCode"
                overrides="true" text="Reformat Code"/>
        <action class="org.wso2.lsp4intellij.actions.LSPShowReformatDialogAction" id="ShowReformatFileDialog"
                use-shortcut-of="ShowReformatFileDialog" overrides="true" text="Show Reformat File Dialog"/>
    </actions>

    <extensions defaultExtensionNs="com.intellij">
        <externalAnnotator id="LSPAnnotator" language="TEXT" implementationClass="org.wso2.lsp4intellij.contributors.annotator.LSPAnnotator"/>
    </extensions>

    <actions>
        <action class="org.wso2.lsp4intellij.actions.LSPReferencesAction" id="LSPFindUsages">
            <keyboard-shortcut first-keystroke="shift alt F7" keymap="$default"/>
        </action>
    </actions>

    <extensions defaultExtensionNs="com.intellij">
        <gotoSymbolContributor implementation="org.wso2.lsp4intellij.contributors.symbol.LSPSymbolContributor"
                               id="LSPSymbolContributor"/>
    </extensions>

    <extensions defaultExtensionNs="com.intellij">
        <renameHandler implementation="org.wso2.lsp4intellij.contributors.rename.LSPRenameHandler"
                       id="LSPRenameHandler" order="first"/>
        <renamePsiElementProcessor implementation="org.wso2.lsp4intellij.contributors.rename.LSPRenameProcessor" id="LSPRenameProcessor" order="first"/>
    </extensions>

    <extensions defaultExtensionNs="com.intellij">
        <typedHandler implementation="org.wso2.lsp4intellij.listeners.LSPTypedHandler"
                      id="LSPTypedHandler"/>
    </extensions>

Not sure if this is useful but I want svelte to work well in Webstorm which is so much nicer than VSCode. If I have time I will try digging deeper. Thanks for your work!

[tomblachut]

@sonyseng this is certainly interesting. If you decide to look into that further don't hesitate to reach out to me if you have some questions.

[maku]

@tomblachut svelte-intellij is not using the svelte language server. But vscode is using it, right? Would it not be a better option to use LSP in svelte-intellij. Sorry but developing svelte stuff is better in vscode then as it is currently in webstorm / intellij (typescript support etc)...

[tomblachut]

@maku You present those options as isolated alternatives, while in reality they must be painstakingly fused together in WebStorm, since the platform provides many features that would clash with LSP without teaching them about Svelte specifics. LSP is under consideration, further down the roadmap.

[maku]

@tomblachut sorry, that can be of course. The point for me is just that I want the best possible type support in my IDE. I don't really care whether this is done with LSP or not. However, I am comparing the features between Intellij Ultimate and vs code. And from my point of view, vs code is better regarding svelte (although Intellij is paid for and svelte-intellij is actually an "official" jetbrains project now, right? ). Usually these notes shouldn't be placed here, but rather as issue jetbrains. So I apologize for the comment here. No offense....

[tomblachut]

No offence taken 🙂

I wanted to express clearly why LSP is not supported right now, since the default train of thought is "well, there are great svelte-language-tools available for over a year, why don't they just use it", unfortunately it's not that simple.

Yes, now I maintain svelte-intellij during my working hours, which is great and it greatly sped up development, yet there's a lot to do and the process from going from community contribution to rock-solid integration is also a lengthy one, especially with some hacks that were written before in this repo.

Type resolution is based on file resolution which is based on... and again and again. We're getting closer and closer to seamless type experience, even if it's not visible at a first glance.

There was a time when this plugin was much better (well, I were told that) than VSCode one, and it still is for other people. Everybody has different priorities and those priorities need to be somehow managed. I hope that in the near future you'll be able to say it's great.

BTW If you open a ticket in YouTrack it will be assigned to me, so please do not duplicate, thank you.

[Bilge]

Am I right in thinking that, until this issue is resolved, there will be no TypeScript validation within the IDE? That is, no static analysis of TypeScript embedded in Svelte components?

[tomblachut]

@Bilge no, analysis can be built on IDE side

[Bilge]

OK? But currently there is no support for TS in Svelte in IntelliJ, right? Is there another issue to track that?

[tomblachut]

@Bilge TS works inside script tag. There's a couple of remaining open issues https://github.com/tomblachut/svelte-intellij/labels/area%3A%20types

[Bilge]

What do you mean by, works, though? There's no validation whatsoever (besides that which ships with the IDE) and it certainly doesn't validate according to the settings of the nearest tsconfig.json.

[tomblachut]

Please show an example of what do you mean, ideally in separate issue because it does not seem to be related to LSP discussion

[Gieted]

Please show an example of what do you mean, ideally in separate issue because it does not seem to be related to LSP discussion

Here's an example:

normal .ts file:

.svelte file with lang="ts":

This feature is very important, without real support of TypeScript in .svelte files, this plugin seems very lacking

[tomblachut]

Migrated to WEB-58397 use the svelte language server