mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-29 19:30:37 +01:00
docs(installation): add documentation for intellisense on SFC objects (#382)
Co-authored-by: Benjamin Canac <canacb1@gmail.com>
This commit is contained in:
@@ -73,16 +73,35 @@ If you do so, you'll need to add the following to your `.vscode/settings.json`:
|
|||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
Also, the extension won't work when writing classes in your `app.config.ts` by default. You can add the following to your `.vscode/settings.json` to fix this:
|
Note, the extension won't work when writing classes in your `app.config.ts` by default.
|
||||||
|
|
||||||
|
Also, you might want IntelliSense on objects in your SFC by prefixing with `/*ui*/`.
|
||||||
|
|
||||||
|
To enable these two features, you can add the following to your `.vscode/settings.json`:
|
||||||
|
|
||||||
```json [.vscode/settings.json]
|
```json [.vscode/settings.json]
|
||||||
{
|
{
|
||||||
"tailwindCSS.experimental.classRegex": [
|
"tailwindCSS.experimental.classRegex": [
|
||||||
["ui:\\s*{([^)]*)\\s*}", "[\"'`]([^\"'`]*).*?[\"'`]"]
|
["ui:\\s*{([^)]*)\\s*}", "[\"'`]([^\"'`]*).*?[\"'`]"]
|
||||||
|
["/\\*ui\\*/\\s*{([^;]*)}", ":\\s*[\"'`]([^\"'`]*).*?[\"'`]"],
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
|
An example SFC using IntelliSense (note the `/*ui*/` prefix, also works with `ref()`):
|
||||||
|
|
||||||
|
```vue [example.vue]
|
||||||
|
<template>
|
||||||
|
<UCard :ui="ui" />
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
const ui = /*ui*/ {
|
||||||
|
background: 'bg-white dark:bg-slate-900'
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
```
|
||||||
|
|
||||||
You can also add the following to your `.vscode/settings.json` to enable IntelliSense when using the `ui` prop:
|
You can also add the following to your `.vscode/settings.json` to enable IntelliSense when using the `ui` prop:
|
||||||
|
|
||||||
```json [.vscode/settings.json]
|
```json [.vscode/settings.json]
|
||||||
|
|||||||
Reference in New Issue
Block a user