docs: Add Tailwind configuration section for JavaScript/TypeScript (#45057)
Addresses some tasks in #43969. Namely adding TailwindCSS documentation for the following languages: HTML, JavaScript and Typescript. **Some Notes** - Maybe the additional information in the HTML section is unnecessary, unsure open to suggestions. - I tried utilizing capturing groups with alternatives like `\\.(add|remove|toggle|contains)` but this didn't seem to work, so I was forced to use multiple lines. Release Notes: - N/A --------- Co-authored-by: Danilo Leal <daniloleal09@gmail.com>
This commit is contained in:
1 parent
28c28b1d8e
commit
f9823eb6bd
4 files changed
+76
-25
No files matched your search
@@ -175,6 +175,34 @@ You can configure ESLint's `workingDirectory` setting:
|
||||
}
|
||||
```
|
||||
|
||||
## Using the Tailwind CSS Language Server with JavaScript
|
||||
|
||||
To get all the features (autocomplete, linting, etc.) from the [Tailwind CSS language server](https://github.com/tailwindlabs/tailwindcss-intellisense/tree/HEAD/packages/tailwindcss-language-server#readme) in vanilla JavaScript files (`.js`), you can customize the `classRegex` field under it in your `settings.json`:
|
||||
|
||||
```json [settings]
|
||||
{
|
||||
"lsp": {
|
||||
"tailwindcss-language-server": {
|
||||
"settings": {
|
||||
"experimental": {
|
||||
"classRegex": [
|
||||
"\\.className\\s*[+]?=\\s*['\"]([^'\"]*)['\"]",
|
||||
"\\.setAttributeNS\\(.*,\\s*['\"]class['\"],\\s*['\"]([^'\"]*)['\"]",
|
||||
"\\.setAttribute\\(['\"]class['\"],\\s*['\"]([^'\"]*)['\"]",
|
||||
"\\.classList\\.add\\(['\"]([^'\"]*)['\"]",
|
||||
"\\.classList\\.remove\\(['\"]([^'\"]*)['\"]",
|
||||
"\\.classList\\.toggle\\(['\"]([^'\"]*)['\"]",
|
||||
"\\.classList\\.contains\\(['\"]([^'\"]*)['\"]",
|
||||
"\\.classList\\.replace\\(\\s*['\"]([^'\"]*)['\"]",
|
||||
"\\.classList\\.replace\\([^,)]+,\\s*['\"]([^'\"]*)['\"]"
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## Debugging
|
||||
|
||||
Zed supports debugging JavaScript code out of the box with `vscode-js-debug`.
|
||||
@@ -186,7 +214,7 @@ The following can be debugged without writing additional configuration:
|
||||
Run {#action debugger::Start} ({#kb debugger::Start}) to see a contextual list of these predefined debug tasks.
|
||||
|
||||
> **Note:** Bun test is automatically detected when `@types/bun` is present in `package.json`.
|
||||
>
|
||||
|
||||
> **Note:** Node test is automatically detected when `@types/node` is present in `package.json` (requires Node.js 20+).
|
||||
|
||||
As for all languages, configurations from `.vscode/launch.json` are also available for debugging in Zed.
|
||||
|
||||
Reference in new issue
Block a user