Support multiple language servers for single file/workspace

[yyoncho]

LSP mode must support multiple LSP servers for single file/workspace similar to what the other implementations(Che/VSCode) already do.

See eclipse-che/che#4609

[TysonAndre]

Possible duplicate of #105

[yyoncho]

@TysonAndre no, #105 is to support different servers for the same mode per workspace. This bug is to support multiple simultaneous servers running in the same file and providing data for the file simultaneously, e.g. running HTML and JS LSP servers in one file.

[yyoncho]

@vibhavp can you share your thoughts? If there are no volunteers to implement this feature I will work on it, but this is not going to happen anytime soon. Since this would require some bit restructuring on lsp-mode side I want to discuss it upfront. I think that it would be good to address some of the lsp-mode flaws related to process management.

[yyoncho]

@vibhavp @MaskRay
I am investigating whether sesman could be a good fit for our usecase which is used by cider for a similar use case. I believe that it could improve the user experience related to visibility what are the currently running servers(check sesman-browser), it will cleanup a lot of code related to session management which complexity is going to increase. Also, it will make the writing of extension against LSP mode much easier compared to current ad-hoc session management with lsp--workspaces hash table.

(cc sesman owner @vspinu)

[yyoncho]

This feature is not for embedded source blocks. I mean, if the server (in this case typescript language server) supports working in blocks that are embedded in another language, then it will work. You may test that by doing M-x lsp-disconnect and then C-u M-x lsp and pick ts-ls. If the server works, then we can arrange lsp-mode to start both ts-ls and vue-ls in this file.

[RKBK]

I was able to define a polymode to use different major modes in each part of a vue file:
AdamNiederer/vue-mode#109
With this setup, I get vetur via lsp working, for all three sections (typescript, the vue-html part, and the scss part). I guess vetur is used just because it is suggested for .vue files, and I have installed it.

@yyoncho How would I go about adding javascript-eslint in addition to vetur? Is there a file in lsp-mode that I could modify just to try it? Or is this somehow already handled (I see something related in the lsp-eslint.el, for applying fixes, but does that also show errors inline?)?

I've set flycheck to add on javascript-eslint. That works, but the checking is much slower than in vscode (results are instant in vscode, but take perhaps 2 s if run via flycheck). However, the lsp results from vetur (the indicator next to the lsp icon updates quickly) seem to be essentially instant, so I suspect that if I can get vetur+eslint via lsp, the feedback would be instant in emacs too.

[yyoncho]

@RKBK AFAICS eslint client is registered for vue files:

https://github.com/yyoncho/lsp-mode/blob/modes/clients/lsp-eslint.el#L270

Do you have the server installed? If not just do M-x lsp-install-server RET eslint RET

[RKBK]

@yyoncho That's one weird thing about my emacs, I don't get that option for .vue files. I get:

[yyoncho]

@RKBK this means that it is most likely installed. Have you verified that eslint is not actually running when doing M-x lsp in vue file? Also you may force starting a server by doing C-u M-x lsp and then selecting a server.

[RKBK]

@yyoncho You were right! Sorry. Thanks for pointing out the keybind. The server exits, but I suppose I have misconfigured something:

node:internal/modules/cjs/loader:928
  throw err;
  ^

Error: Cannot find module '/home/rasmus/Projects/todo/~/server/out/eslintServer.js'
    at Function.Module._resolveFilename (node:internal/modules/cjs/loader:925:15)
    at Function.Module._load (node:internal/modules/cjs/loader:769:27)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:76:12)
    at node:internal/main/run_main_module:17:47 {
  code: 'MODULE_NOT_FOUND',
  requireStack: []
}

[yyoncho]

@RKBK I suggest deleting this installation, reverting eslint related customization and installing it via M-x lsp-install-server.

[RKBK]

@yyoncho
I have deleted all the lsp-* folders from .emacs.d/elpa, as well as emptied out .emacs.d/.cache . After allowing everything to reinstall, I am able to execute C-u M-x lsp and select eslint inside the .vue file. But still, the vls server is then started, not eslint! Also, I was never asked to download the vls server, so I guess there is something more I need to remove? In addition, the list of available servers to install is still the same as in the screenshot above.

[yyoncho]

@RKBK which lsp-mode version do you run? If you are on melpa-stable please switch to melpa.

[RKBK]

@yyoncho Switching to melpa and cleaning again seemed to have done it. Eslint (and a ton of other lsps) was now installable, and I could switch to it. Eslint now seems to work, too.

Is melpa needed for any other related package too, e.g. company, posframe, treemacs?

How do I now go about and have vls and eslint both running at the same time?

[yyoncho]

Is melpa needed for any other related package too, e.g. company, posframe, treemacs?

flycheck for sure. For the rest, I don't know. For lsp-mode I generally recommend running melpa versions. Running melpa-stable version is tricky since you should install also the versions of the servers from that point in time.

How do I now go about and have vls and eslint both running at the same time?

It should work OOTB after doing M-x lsp.

[RKBK]

Wow, now that the eslint server is installed, after restarting emacs (probably not necessary), and opening the file, lsp noted:

LSP :: vls:17199 initialized successfully
LSP :: eslint:17200 initialized successfully
LSP :: Connected to [vls:17199][eslint:17200]. [2 times]

And it seems to work, giving me the same sort of feedback, and similarly instantly, as in vscode! It also seems to work just as well in .ts files.

I've now pinned melpa for the lsp packages, so let's see how this goes.

Many thanks. This is truly impressive work.

[yyoncho]

Good.

And it seems to work, giving me the same sort of feedback, and similarly instantly, as in vscode! It also seems to work just as well in .ts files.

You might be interested in: https://emacs-lsp.github.io/lsp-mode/tutorials/reactjs-tutorial/

[RKBK]

There is one more thing that I don't manage to get working. In vue files, in html sections, in vue components, there is no validation information shown. E.g. if there was a .vue file (leaving out the details) like

<script lang='ts'>
// Various setup stuff
return parameter;
</script>
<template>
<div>
<my-component
  v-model="model"
  my-component-parameter: "paramter"
/>
</div>
</template>

I don't get any error text for "paramter" (it should be "parameter") being misspelled, although I do get that in vscode for the same project. Oddly, I also get the same sort of error in the typescript sections.

Other lsp errors do get reported in the exact same part of the file, e.g. we don't allow trailing spaces, and such errors get reported also in the template part. But, as said, things inside tags don't seem to be verified, or the error at least isn't reported.

[yyoncho]

we should crosscheck which language server is running in vscode and in emacs case.

[RKBK]

Vetur is used in vscode. The following vetur-specific settings are applied (I removed the lines not specific to vetur):

{
    "vetur.experimental.templateInterpolationService": true,
    "vetur.useWorkspaceDependencies": true,
    "vetur.validation.templateProps": true,
    "vetur.grammar.customBlocks": {
      "docs": "md",
      "i18n": "json"
    },
}

Vetur is used also in lsp-emacs. The vetur.validation.templateProps: true part is, I guess, the same as the variable lsp-vetur-validation-template, which has the value t in my emacs.

However, I did not have the setting corresponding to
"vetur.experimental.templateInterpolationService": true,
set. After doing
(setq lsp-vetur-experimental-template-interpolation-service t)
and restarting the vls server, that check started to work in lsp-mode too!

I guess we simply had activated that feature, which is not enabled by default, so I suppose it makes sense for it not to be enabled by default in lsp-mode.

As for the other setting, "vetur.useWorkspaceDependencies": true, it turns out that is to use relative imports, i.e. import ../someOtherFolder/someTypescriptModule instead of import src/someOtherFolder/someTypescriptModule.

[yyoncho]

@RKBK feel free to provide a PR to change the defaults to more meaningful.

[RKBK]

@yyoncho I'm sorry for being a bit unclear. I've come to realize that the settings I were missing were in fact simply non-default settings. So it makes sense that I would need to set them myself in emacs, too. I'm a bit new to both vue and lsp-emacs, so how to do that on the emacs end for vue was confusing at first. Now, I think I've understood how to get vls set up the same way as we have it set up in vscode.

It looks like the defaults for vls in lsp-emacs are in fact the same as in vscode.

Thank you for all your help!

[hectorhon]

I notice flymake (emacs 27.1, windows) does not "keep" all the errors when there are multiple lsp servers for the buffer. In my case, I am using flymake + ts-ls lsp + eslint lsp. Immediately after I make an edit, I can briefly see errors/warnings (from eslint, which has stricter eslintrc configured) being underlined before disappearing (as ts-ls output takes over). The workaround is to use flycheck, which keeps errors from both lsp servers in the buffer.

[yyoncho]

@hectorhon can you upgrade your flymake? I think that we had issues with older versions.

[hectorhon]

@yyoncho I just updated to the latest emacs 27.2 (with built in flymake 1.0.8) and the issue persists. Same after upgrading to flymake from 1.0.8 to 1.1.1. But I agree it's probably an issue with flymake, since flycheck is working fine.

[yyoncho]

@yyoncho I just updated to the latest emacs 27.2 (with built in flymake 1.0.8) and the issue persists. Same after upgrading to flymake from 1.0.8 to 1.1.1. But I agree it's probably an issue with flymake, since flycheck is working fine.

It is most likely issue with lsp-mode integration with flymake. Does it work if you have one server only?

[hectorhon]

Yes, flymake does work if I have only one of ts-ls or eslint installed.

[yyoncho]

@hectorhon then, can you open lsp-mode issue to track the problem(no need to fill the whole bug template).

[hectorhon]

@yyoncho Sure, created #2808 . Thank you!