Tailwind CSS#
Server#
For more information about the LSP server, check tailwindcss-language-server.
Installation#
This Server supports automatic install.
Install this language server with M-xlsp-install-serverRETtailwindcssRET.
npm install -g @tailwindcss/language-server
Debugger: Not available#
Available configurations#
lsp-tailwindcss-add-on-mode#
Type: boolean
Default: nil
Specify lsp-tailwindcss as add-on so it can work with other language servers.
lsp-tailwindcss-class-attributes#
Type: lsp-string-vector
Default: [class className ngClass class:list]
The HTML attributes to provide class completions, hover previews, linting etc.
lsp-tailwindcss-class-functions#
Type: lsp-string-vector
Default: nil
Functions in which to provide completions, hover previews, linting etc. Currently, this works for both function calls and tagged template literals in JavaScript / TypeScript.
lsp-tailwindcss-code-actions#
Type: boolean
Default: t
Enable code actions.
lsp-tailwindcss-emmet-completions#
Type: boolean
Default: nil
Enable completions when using Emmet-style syntax. For example div.bg-red-500.uppercase.
lsp-tailwindcss-experimental-class-regex#
Type: string
Default: ``
Custom regex to match tailwindcss classes.
lsp-tailwindcss-experimental-config-file#
Type: sexp
Default: nil
Manually specify the Tailwind config file or files. It can be a single string or a hash map. See https://github.com/tailwindlabs/tailwindcss-intellisense#tailwindcssexperimentalconfigfile
Example: (setq lsp-tailwindcss-experimental-config-file "config/tailwindcss.conf.js")
(setq lsp-tailwindcss-experimental-config-file (ht ("themes/simple/tailwind.config.js" "themes/simple/") ("themes/neon/tailwind.config.js" "themes/neon/")))
lsp-tailwindcss-hovers#
Type: boolean
Default: t
Enable hovers.
lsp-tailwindcss-lint-css-conflict#
Type: (choice (const ignore) (const warning) (const error))
Default: warning
Class names on the same HTML element which apply the same CSS property or properties.
lsp-tailwindcss-lint-invalid-apply#
Type: (choice (const ignore) (const warning) (const error))
Default: error
Unsupported use of the @apply directive.
lsp-tailwindcss-lint-invalid-config-path#
Type: (choice (const ignore) (const warning) (const error))
Default: error
Unknown or invalid path used with the theme helper.
lsp-tailwindcss-lint-invalid-screen#
Type: (choice (const ignore) (const warning) (const error))
Default: error
Unknown screen name used with the @screen directive.
lsp-tailwindcss-lint-invalid-tailwind-directive#
Type: (choice (const ignore) (const warning) (const error))
Default: error
Unknown value used with the @tailwind directive.
lsp-tailwindcss-lint-invalid-variant#
Type: (choice (const ignore) (const warning) (const error))
Default: error
Unknown variant name used with the @variants directive.
lsp-tailwindcss-lint-recommended-variant-order#
Type: (choice (const ignore) (const warning) (const error))
Default: warning
Class variants not in the recommended order (applies in JIT mode only).
lsp-tailwindcss-major-modes#
Type: (repeat symbol)
Default: (rjsx-mode web-mode html-mode css-mode typescript-mode typescript-tsx-mode tsx-ts-mode)
Major modes that lsp-tailwindcss should activate.
lsp-tailwindcss-root-font-size#
Type: number
Default: 16
Root font size in pixels.
Used to convert rem CSS values to their px equivalents.
See lsp-tailwindcss-show-pixel-equivalents.
lsp-tailwindcss-rustywind-command#
Type: string
Default: nil
[Experimental] Command used for sorting the tailwindcss classes.
lsp-tailwindcss-rustywind-extra-args#
Type: (repeat string)
Default: nil
[Experimental] Extra arguments to use when invoking rustywind.
lsp-tailwindcss-server-path#
Type: string
Default: ``
Path to the tailwindcss lsp server binary (node.js executable).
Leave empty to use the managed installation.
lsp-tailwindcss-server-version#
Type: string
Default: 0.14.7
Specify the version of tailwindcss intellisense.
lsp-tailwindcss-show-pixel-equivalents#
Type: boolean
Default: t
Show px equivalents for rem CSS values in completions and hovers.
lsp-tailwindcss-skip-config-check#
Type: boolean
Default: nil
Force skip config file check. Only use it when your config file is in an unconventional location and you are sure tailwindcss language server can find it.
lsp-tailwindcss-suggestions#
Type: boolean
Default: t
Enable autocomplete suggestions.
lsp-tailwindcss-validate#
Type: boolean
Default: t
Enable linting. Rules can be configured individually using the lsp-tailwindcss-lint-* settings: ignore: disable lint rule entirely warning: rule violations will be considered "warnings" error: rule violations will be considered "errors"