The lsp-mode client for tailwindcss, using language server from official vscode plugin.

in packages.el

(package! lsp-tailwindcss :recipe (:host github :repo "merrickluo/lsp-tailwindcss"))

in config.el

(use-package! lsp-tailwindcss)

(straight-use-package
 '(lsp-tailwindcss :type git :host github :repo "merrickluo/lsp-tailwindcss"))

1. use M-x lsp-install-server, then select tailwindcss.
2. use npm, npm install -g @tailwindcss/language-server.

1. use C-u M-x lsp-install-server, then select tailwindcss.
2. use npm, npm install -g @tailwindcss/language-server.

• now uses tailwindcss language server instead of manually download the vscode extension file.

• added lsp-tailwindcss-major-modes, see details in #Customization section.
• allow global and workspace configuration for tailwindcss-language-server.
• make variables lsp-tailwindcss-server-dir, lsp-tailwindcss-server-file, lsp-tailwindcss-auto-install-server, lsp-tailwindcss-server-version obsolete.

Specify that if lsp-tailwindcss runs in add-on mode, see in lsp-mode’s documentation. This must be set before the package loads. default: nil.

Specify lsp-tailwindcss should only starts when major-mode in the list or derived from them. default: rjsx-mode web-mode html-mode css-mode.

All settings described in tailwindcss-intellisense except:

• tailwindCSS.includeLanguages The activation of the language server is controlled by lsp-tailwindcss--activate-p, so this is not needed.
• tailwindCSS.colorDecorators Emacs does not support color decorators.

Default value follows the default value in the documentation.

Custom variable naming convention: tailwindCSS.emmetCompletions > =lsp-tailwindcss-emmet-completions.

There are two functions integrate the rustywind class sorter, lsp-tailwindcss-rustywind and lsp-tailwindcss-rustywind-before-save.

After install rustywind npm i -g rustywind, run lsp-tailwindcss-rustywind manually or add it to before-save-hook to use it.

(add-hook 'before-save-hook 'lsp-tailwindcss-rustywind-before-save)