让Eglot支持tailwindcss以及多个LSP服务

前言

虽然我不是专业的前端开发人员，但偶尔还是会写一下 HTML/CSS/Javascript 或者Vue。在一个 HTML 文件中，我需要使用多个 LSP服务，比如使用 vscode-html-language-server 补全css样式，使用tailwindcss-language-server 补全tailwindcss的class名称，使用 vscode-eslint-language-server 检查语法

但我目前使用的Emacs lSP客户端 Eglot 一直不支持多个LSP服务，目前的解决方式有两种，一是把 Eglot 更换为 lsp-mode 或者 lsp-bridge， 二是使用第三方命令行代理服务，比如:

• https://github.com/thefrontside/lspx

• https://github.com/joaotavora/rassumfrassum

lspx 是因为我的电脑上没有相关环境，无法编译，rass 是由 Eglot 的作者开发，不过看情况他是准备把 rass 作为一个通用的LSP代理，所以配置文件会单独放置到 HOME 目录，这一点我不是很喜欢

算了，找来找去还不如自己写一个(轮子+1)，eglot-lspx，一个多LSP代理服务，用于解决 Eglot 无法使用 tailwindcss 以及不支持多个LSP服务的问题

如何使用？

• 编译

  git clone https://github.com/honmaple/eglot-lspx
  cd eglot-lspx
  go build .

  然后把编译好的 eglot-lspx 文件放到可执行路径下，比如我放到了 ~/.emacs.d/bin 目录，并添加路径到Emacs配置

  (add-to-list 'exec-path (expand-file-name "bin" user-emacs-directory) t)

• 配置Eglot

  (defvar eglot-lspx-command (executable-find "eglot-lspx"))
  
  (when eglot-lspx-command
    (add-to-list 'eglot-server-programs `((web-mode :language-id "html")
                                          . (,eglot-lspx-command
                                             "--" "vscode-html-language-server" "--stdio"
                                             "--" "tailwindcss-language-server" "--stdio")))
    (add-to-list 'eglot-server-programs `((vue-mode :language-id "html")
                                          . (,eglot-lspx-command
                                             "--" "vue-language-server" "--stdio"
                                             "--" "vscode-html-language-server" "--stdio"
                                             "--" "tailwindcss-language-server" "--stdio"
                                             :initializationOptions
                                             (lambda (server) (list :vue-language-server (eglot-volar-options server)))))))

• 合并补全信息

  --provider completion=0,tailwindcss-language-server

  可以使用LSP服务名或者索引名，使用逗号分隔，索引名即第n个LSP服务，从0开始，未设置将合并全部

示例