add lerna and separate language server package
|
@ -1,3 +1,2 @@
|
|||
node_modules
|
||||
dist
|
||||
*.vsix
|
||||
/*.vsix
|
||||
|
|
|
@ -7,10 +7,10 @@
|
|||
"request": "launch",
|
||||
"name": "Launch Client",
|
||||
"runtimeExecutable": "${execPath}",
|
||||
"args": ["--extensionDevelopmentPath=${workspaceRoot}"],
|
||||
"args": ["--extensionDevelopmentPath=${workspaceRoot}/packages/vscode-tailwindcss"],
|
||||
"stopOnEntry": false,
|
||||
"sourceMaps": true,
|
||||
"outFiles": ["${workspaceRoot}/dist/extension/**/*.js"],
|
||||
"outFiles": ["${workspaceRoot}/packages/vscode-tailwindcss/dist/**/*.js"]
|
||||
// "preLaunchTask": "npm: dev"
|
||||
},
|
||||
{
|
||||
|
@ -21,7 +21,7 @@
|
|||
"protocol": "inspector",
|
||||
"port": 6011,
|
||||
"sourceMaps": true,
|
||||
"outFiles": ["${workspaceRoot}/dist/server/**/*.js"]
|
||||
"outFiles": ["${workspaceRoot}/packages/vscode-tailwindcss/dist/**/*.js"]
|
||||
},
|
||||
{
|
||||
"type": "node",
|
||||
|
@ -31,7 +31,7 @@
|
|||
"protocol": "inspector",
|
||||
"port": 6012,
|
||||
"sourceMaps": true,
|
||||
"outFiles": ["${workspaceRoot}/dist/server/**/*.js"]
|
||||
"outFiles": ["${workspaceRoot}/packages/vscode-tailwindcss/dist/**/*.js"]
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
125
README.md
|
@ -1,125 +0,0 @@
|
|||
<img src="https://raw.githubusercontent.com/bradlc/vscode-tailwindcss/master/.github/banner-dark.png" alt="" />
|
||||
|
||||
Tailwind CSS IntelliSense enhances the Tailwind development experience by providing Visual Studio Code users with advanced features such as autocomplete, syntax highlighting, and linting.
|
||||
|
||||
## Installation
|
||||
|
||||
**[Install via the Visual Studio Code Marketplace →](https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss)**
|
||||
|
||||
In order for the extension to activate you must have [`tailwindcss` installed](https://tailwindcss.com/docs/installation) and a [Tailwind config file](https://tailwindcss.com/docs/installation#create-your-configuration-file) named `tailwind.config.js` in your workspace.
|
||||
|
||||
## Features
|
||||
|
||||
### Autocomplete
|
||||
|
||||
Intelligent suggestions for class names, as well as [CSS functions and directives](https://tailwindcss.com/docs/functions-and-directives/).
|
||||
|
||||
<img src="https://raw.githubusercontent.com/bradlc/vscode-tailwindcss/master/.github/autocomplete.png" alt="" />
|
||||
|
||||
### Linting
|
||||
|
||||
Highlights errors and potential bugs in both your CSS and your markup.
|
||||
|
||||
<img src="https://raw.githubusercontent.com/bradlc/vscode-tailwindcss/master/.github/linting.png" alt="" />
|
||||
|
||||
### Hover Preview
|
||||
|
||||
See the complete CSS for a Tailwind class name by hovering over it.
|
||||
|
||||
<img src="https://raw.githubusercontent.com/bradlc/vscode-tailwindcss/master/.github/hover.png" alt="" />
|
||||
|
||||
### CSS Syntax Highlighting
|
||||
|
||||
Provides syntax definitions so that Tailwind features are highlighted correctly.
|
||||
|
||||
## Recommended VS Code Settings
|
||||
|
||||
VS Code has built-in CSS validation which may display errors when using Tailwind-specific syntax, such as `@apply`. You can disable this with the `css.validate` setting:
|
||||
|
||||
```
|
||||
"css.validate": false
|
||||
```
|
||||
|
||||
By default VS Code will not trigger completions when editing "string" content, for example within JSX attribute values. Updating the `editor.quickSuggestions` setting may improve your experience:
|
||||
|
||||
```
|
||||
"editor.quickSuggestions": {
|
||||
"strings": true
|
||||
}
|
||||
```
|
||||
|
||||
## Extension Settings
|
||||
|
||||
### `tailwindCSS.includeLanguages`
|
||||
|
||||
This setting allows you to add additional language support. The key of each entry is the new language ID and the value is any one of the extensions built-in languages, depending on how you want the new language to be treated (e.g. `html`, `css`, or `javascript`):
|
||||
|
||||
```json
|
||||
{
|
||||
"tailwindCSS.includeLanguages": {
|
||||
"plaintext": "html"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### `tailwindCSS.emmetCompletions`
|
||||
|
||||
Enable completions when using [Emmet](https://emmet.io/)-style syntax, for example `div.bg-red-500.uppercase`. **Default: `false`**
|
||||
|
||||
### `tailwindCSS.colorDecorators`
|
||||
|
||||
Controls whether the editor should render inline color decorators for Tailwind CSS classes and helper functions. **Default: `true`**
|
||||
|
||||
> Note that `editor.colorDecorators` must be enabled for color decorators to be shown.
|
||||
|
||||
### `tailwindCSS.showPixelEquivalents`
|
||||
|
||||
Show `px` equivalents for `rem` CSS values in completions and hovers. **Default: `true`**
|
||||
|
||||
### `tailwindCSS.rootFontSize`
|
||||
|
||||
Root font size in pixels. Used to convert `rem` CSS values to their `px` equivalents. See [`tailwindCSS.showPixelEquivalents`](#tailwindcssshowpixelequivalents). **Default: `16`**
|
||||
|
||||
### `tailwindCSS.validate`
|
||||
|
||||
Enable linting. Rules can be configured individually using the `tailwindcss.lint` settings:
|
||||
|
||||
- `ignore`: disable lint rule entirely
|
||||
- `warning`: rule violations will be considered "warnings," typically represented by a yellow underline
|
||||
- `error`: rule violations will be considered "errors," typically represented by a red underline
|
||||
|
||||
#### `tailwindCSS.lint.invalidScreen`
|
||||
|
||||
Unknown screen name used with the [`@screen` directive](https://tailwindcss.com/docs/functions-and-directives/#screen). **Default: `error`**
|
||||
|
||||
#### `tailwindCSS.lint.invalidVariant`
|
||||
|
||||
Unknown variant name used with the [`@variants` directive](https://tailwindcss.com/docs/functions-and-directives/#variants). **Default: `error`**
|
||||
|
||||
#### `tailwindCSS.lint.invalidTailwindDirective`
|
||||
|
||||
Unknown value used with the [`@tailwind` directive](https://tailwindcss.com/docs/functions-and-directives/#tailwind). **Default: `error`**
|
||||
|
||||
#### `tailwindCSS.lint.invalidApply`
|
||||
|
||||
Unsupported use of the [`@apply` directive](https://tailwindcss.com/docs/functions-and-directives/#apply). **Default: `error`**
|
||||
|
||||
#### `tailwindCSS.lint.invalidConfigPath`
|
||||
|
||||
Unknown or invalid path used with the [`theme` helper](https://tailwindcss.com/docs/functions-and-directives/#theme). **Default: `error`**
|
||||
|
||||
#### `tailwindCSS.lint.cssConflict`
|
||||
|
||||
Class names on the same HTML element which apply the same CSS property or properties. **Default: `warning`**
|
||||
|
||||
#### `tailwindCSS.lint.recommendedVariantOrder`
|
||||
|
||||
Class variants not in the recommended order (applies in [JIT mode](https://tailwindcss.com/docs/just-in-time-mode) only). **Default: `warning`**
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
If you’re having issues getting the IntelliSense features to activate, there are a few things you can check:
|
||||
|
||||
- Ensure that you have a Tailwind config file in your workspace and that this is named `tailwind.config.js`. Check out the Tailwind documentation for details on [creating a config file](https://tailwindcss.com/docs/installation#create-your-configuration-file).
|
||||
- Ensure that the `tailwindcss` module is installed in your workspace, via `npm`, `yarn`, or `pnpm`.
|
||||
- Make sure your VS Code settings aren’t causing your Tailwind config file to be excluded from search, for example via the `search.exclude` setting.
|
|
@ -0,0 +1,4 @@
|
|||
{
|
||||
"version": "independent",
|
||||
"packages": ["packages/*"]
|
||||
}
|
|
@ -1,243 +1,10 @@
|
|||
{
|
||||
"name": "vscode-tailwindcss",
|
||||
"displayName": "Tailwind CSS IntelliSense",
|
||||
"description": "Intelligent Tailwind CSS tooling for VS Code",
|
||||
"preview": true,
|
||||
"author": "Brad Cornes <hello@bradley.dev>",
|
||||
"license": "MIT",
|
||||
"version": "0.6.6",
|
||||
"homepage": "https://github.com/tailwindlabs/tailwindcss-intellisense",
|
||||
"bugs": {
|
||||
"url": "https://github.com/tailwindlabs/tailwindcss-intellisense/issues",
|
||||
"email": "hello@bradley.dev"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/tailwindlabs/tailwindcss-intellisense.git"
|
||||
},
|
||||
"publisher": "bradlc",
|
||||
"keywords": [
|
||||
"tailwind",
|
||||
"tailwindcss",
|
||||
"css",
|
||||
"intellisense",
|
||||
"autocomplete",
|
||||
"vscode"
|
||||
],
|
||||
"engines": {
|
||||
"vscode": "^1.52.0"
|
||||
},
|
||||
"categories": [
|
||||
"Linters",
|
||||
"Other"
|
||||
],
|
||||
"galleryBanner": {
|
||||
"color": "#f9fafb"
|
||||
},
|
||||
"icon": "media/icon.png",
|
||||
"activationEvents": [
|
||||
"onStartupFinished"
|
||||
],
|
||||
"main": "dist/extension/index.js",
|
||||
"contributes": {
|
||||
"commands": [
|
||||
{
|
||||
"command": "tailwindCSS.showOutput",
|
||||
"title": "Tailwind CSS: Show Output",
|
||||
"enablement": "tailwindCSS.hasOutputChannel"
|
||||
}
|
||||
],
|
||||
"grammars": [
|
||||
{
|
||||
"scopeName": "tailwindcss.injection",
|
||||
"path": "./syntaxes/tailwind.tmLanguage.json",
|
||||
"injectTo": [
|
||||
"source.css",
|
||||
"source.css.scss",
|
||||
"source.css.less",
|
||||
"source.css.postcss",
|
||||
"source.vue",
|
||||
"source.svelte",
|
||||
"text.html"
|
||||
]
|
||||
}
|
||||
],
|
||||
"configuration": {
|
||||
"title": "Tailwind CSS IntelliSense",
|
||||
"properties": {
|
||||
"tailwindCSS.emmetCompletions": {
|
||||
"type": "boolean",
|
||||
"default": false,
|
||||
"markdownDescription": "Enable class name completions when using Emmet-style syntax, for example `div.bg-red-500.uppercase`"
|
||||
},
|
||||
"tailwindCSS.includeLanguages": {
|
||||
"type": "object",
|
||||
"additionalProperties": {
|
||||
"type": "string"
|
||||
},
|
||||
"default": {},
|
||||
"markdownDescription": "Enable features in languages that are not supported by default. Add a mapping here between the new language and an already supported language.\n E.g.: `{\"plaintext\": \"html\"}`"
|
||||
},
|
||||
"tailwindCSS.colorDecorators": {
|
||||
"type": "boolean",
|
||||
"default": true,
|
||||
"markdownDescription": "Controls whether the editor should render inline color decorators for Tailwind CSS classes and helper functions.",
|
||||
"scope": "language-overridable"
|
||||
},
|
||||
"tailwindCSS.validate": {
|
||||
"type": "boolean",
|
||||
"default": true,
|
||||
"markdownDescription": "Enable linting. Rules can be configured individually using the `tailwindcss.lint.*` settings",
|
||||
"scope": "language-overridable"
|
||||
},
|
||||
"tailwindCSS.lint.cssConflict": {
|
||||
"type": "string",
|
||||
"enum": [
|
||||
"ignore",
|
||||
"warning",
|
||||
"error"
|
||||
],
|
||||
"default": "warning",
|
||||
"markdownDescription": "Class names on the same HTML element which apply the same CSS property or properties",
|
||||
"scope": "language-overridable"
|
||||
},
|
||||
"tailwindCSS.lint.invalidApply": {
|
||||
"type": "string",
|
||||
"enum": [
|
||||
"ignore",
|
||||
"warning",
|
||||
"error"
|
||||
],
|
||||
"default": "error",
|
||||
"markdownDescription": "Unsupported use of the [`@apply` directive](https://tailwindcss.com/docs/functions-and-directives/#apply)",
|
||||
"scope": "language-overridable"
|
||||
},
|
||||
"tailwindCSS.lint.invalidScreen": {
|
||||
"type": "string",
|
||||
"enum": [
|
||||
"ignore",
|
||||
"warning",
|
||||
"error"
|
||||
],
|
||||
"default": "error",
|
||||
"markdownDescription": "Unknown screen name used with the [`@screen` directive](https://tailwindcss.com/docs/functions-and-directives/#screen)",
|
||||
"scope": "language-overridable"
|
||||
},
|
||||
"tailwindCSS.lint.invalidVariant": {
|
||||
"type": "string",
|
||||
"enum": [
|
||||
"ignore",
|
||||
"warning",
|
||||
"error"
|
||||
],
|
||||
"default": "error",
|
||||
"markdownDescription": "Unknown variant name used with the [`@variants` directive](https://tailwindcss.com/docs/functions-and-directives/#variants)",
|
||||
"scope": "language-overridable"
|
||||
},
|
||||
"tailwindCSS.lint.invalidConfigPath": {
|
||||
"type": "string",
|
||||
"enum": [
|
||||
"ignore",
|
||||
"warning",
|
||||
"error"
|
||||
],
|
||||
"default": "error",
|
||||
"markdownDescription": "Unknown or invalid path used with the [`theme` helper](https://tailwindcss.com/docs/functions-and-directives/#theme)",
|
||||
"scope": "language-overridable"
|
||||
},
|
||||
"tailwindCSS.lint.invalidTailwindDirective": {
|
||||
"type": "string",
|
||||
"enum": [
|
||||
"ignore",
|
||||
"warning",
|
||||
"error"
|
||||
],
|
||||
"default": "error",
|
||||
"markdownDescription": "Unknown value used with the [`@tailwind` directive](https://tailwindcss.com/docs/functions-and-directives/#tailwind)",
|
||||
"scope": "language-overridable"
|
||||
},
|
||||
"tailwindCSS.lint.recommendedVariantOrder": {
|
||||
"type": "string",
|
||||
"enum": [
|
||||
"ignore",
|
||||
"warning",
|
||||
"error"
|
||||
],
|
||||
"default": "warning",
|
||||
"markdownDescription": "Class variants not in the recommended order (applies in [JIT mode](https://tailwindcss.com/docs/just-in-time-mode) only)",
|
||||
"scope": "language-overridable"
|
||||
},
|
||||
"tailwindCSS.experimental.classRegex": {
|
||||
"type": "array",
|
||||
"scope": "language-overridable"
|
||||
},
|
||||
"tailwindCSS.showPixelEquivalents": {
|
||||
"type": "boolean",
|
||||
"default": true,
|
||||
"markdownDescription": "Show `px` equivalents for `rem` CSS values."
|
||||
},
|
||||
"tailwindCSS.rootFontSize": {
|
||||
"type": "number",
|
||||
"default": 16,
|
||||
"markdownDescription": "Root font size in pixels. Used to convert `rem` CSS values to their `px` equivalents. See `#tailwindCSS.showPixelEquivalents#`."
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"name": "root",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "npm run clean && glob-exec --foreach --parallel \"src/*.ts\" -- \"ncc build {{file}} --watch -o dist/{{file.toString().replace(/^src\\//, '').replace(/\\.ts$/, '')}}\"",
|
||||
"build": "npm run clean && glob-exec --foreach --parallel \"src/*.ts\" -- \"ncc build {{file}} -o dist/{{file.toString().replace(/^src\\//, '').replace(/\\.ts$/, '')}}\" && mv dist/server/index.js dist/server/tailwindServer.js && npm run minify",
|
||||
"minify": "glob-exec --foreach --parallel \"dist/**/*.js\" -- \"terser {{file}} --compress --mangle --output {{file.toString()}}\"",
|
||||
"package": "vsce package",
|
||||
"publish": "vsce publish",
|
||||
"vscode:prepublish": "npm run build",
|
||||
"clean": "rimraf dist",
|
||||
"test": "jest"
|
||||
},
|
||||
"dependencies": {
|
||||
"@ctrl/tinycolor": "3.1.4",
|
||||
"@types/debounce": "1.2.0",
|
||||
"@types/mocha": "5.2.0",
|
||||
"@types/node": "14.14.34",
|
||||
"@types/vscode": "1.54.0",
|
||||
"@vercel/ncc": "0.28.4",
|
||||
"builtin-modules": "3.2.0",
|
||||
"chokidar": "3.5.1",
|
||||
"debounce": "1.2.0",
|
||||
"dlv": "1.1.3",
|
||||
"dset": "2.0.1",
|
||||
"enhanced-resolve": "5.8.0",
|
||||
"fast-glob": "3.2.4",
|
||||
"find-up": "5.0.0",
|
||||
"glob-exec": "0.1.1",
|
||||
"jest": "25.5.4",
|
||||
"klona": "2.0.4",
|
||||
"normalize-path": "3.0.0",
|
||||
"pkg-up": "3.1.0",
|
||||
"postcss": "8.2.6",
|
||||
"postcss-load-config": "3.0.1",
|
||||
"postcss-selector-parser": "6.0.2",
|
||||
"prettier": "^2.2.1",
|
||||
"rimraf": "3.0.2",
|
||||
"semver": "7.3.2",
|
||||
"stack-trace": "0.0.10",
|
||||
"tailwindcss": "2.0.3",
|
||||
"terser": "4.6.12",
|
||||
"typescript": "4.2.4",
|
||||
"vsce": "1.87.0",
|
||||
"vscode-languageclient": "7.0.0",
|
||||
"vscode-languageserver": "7.0.0",
|
||||
"vscode-languageserver-textdocument": "1.0.1",
|
||||
"vscode-uri": "3.0.2"
|
||||
"bootstrap": "lerna bootstrap --hoist"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/moo": "0.5.3",
|
||||
"css.escape": "1.5.1",
|
||||
"detect-indent": "6.0.0",
|
||||
"line-column": "1.0.2",
|
||||
"moo": "0.5.1",
|
||||
"multi-regexp2": "1.0.3",
|
||||
"sift-string": "0.0.2",
|
||||
"vscode-emmet-helper-bundled": "0.0.1"
|
||||
"lerna": "^3.22.1"
|
||||
}
|
||||
}
|
||||
|
|
|
@ -0,0 +1 @@
|
|||
/bin
|
|
@ -0,0 +1,48 @@
|
|||
{
|
||||
"name": "tailwindcss-language-server",
|
||||
"description": "Tailwind CSS Language Server",
|
||||
"version": "0.0.1",
|
||||
"scripts": {
|
||||
"build": "npm run clean && ncc build src/server.ts -o bin --minify && mv bin/index.js bin/tailwindcss-language-server && npm run hashbang",
|
||||
"clean": "rimraf dist",
|
||||
"hashbang": "echo \"#!/usr/bin/env node\n$(cat bin/tailwindcss-language-server)\" > bin/tailwindcss-language-server"
|
||||
},
|
||||
"bin": {
|
||||
"tailwindcss-language-server": "./bin/tailwindcss-language-server"
|
||||
},
|
||||
"files": [
|
||||
"bin"
|
||||
],
|
||||
"devDependencies": {
|
||||
"@ctrl/tinycolor": "3.1.4",
|
||||
"@types/debounce": "1.2.0",
|
||||
"@types/node": "14.14.34",
|
||||
"@types/vscode": "1.56.0",
|
||||
"@vercel/ncc": "0.28.4",
|
||||
"builtin-modules": "3.2.0",
|
||||
"chokidar": "3.5.1",
|
||||
"debounce": "1.2.0",
|
||||
"dlv": "1.1.3",
|
||||
"dset": "2.0.1",
|
||||
"enhanced-resolve": "5.8.0",
|
||||
"fast-glob": "3.2.4",
|
||||
"find-up": "5.0.0",
|
||||
"jest": "25.5.4",
|
||||
"klona": "2.0.4",
|
||||
"normalize-path": "3.0.0",
|
||||
"pkg-up": "3.1.0",
|
||||
"postcss": "8.2.6",
|
||||
"postcss-load-config": "3.0.1",
|
||||
"postcss-selector-parser": "6.0.2",
|
||||
"prettier": "2.3.0",
|
||||
"rimraf": "3.0.2",
|
||||
"semver": "7.3.2",
|
||||
"stack-trace": "0.0.10",
|
||||
"tailwindcss": "2.0.3",
|
||||
"terser": "4.6.12",
|
||||
"typescript": "4.2.4",
|
||||
"vscode-languageserver": "7.0.0",
|
||||
"vscode-languageserver-textdocument": "1.0.1",
|
||||
"vscode-uri": "3.0.2"
|
||||
}
|
||||
}
|
|
@ -156,9 +156,7 @@ async function createProjectService(
|
|||
editor: {
|
||||
connection,
|
||||
globalSettings: params.initializationOptions.configuration as Settings,
|
||||
userLanguages: params.initializationOptions.userLanguages
|
||||
? params.initializationOptions.userLanguages
|
||||
: {},
|
||||
userLanguages: params.initializationOptions.userLanguages,
|
||||
// TODO
|
||||
capabilities: {
|
||||
configuration: true,
|
|
@ -3,16 +3,16 @@
|
|||
"module": "commonjs",
|
||||
"target": "es6",
|
||||
"lib": ["ES2019"],
|
||||
"rootDir": ".",
|
||||
"rootDir": "..",
|
||||
"sourceMap": true,
|
||||
"moduleResolution": "node",
|
||||
"esModuleInterop": true,
|
||||
"allowJs": true,
|
||||
"resolveJsonModule": true,
|
||||
"baseUrl": ".",
|
||||
"baseUrl": "..",
|
||||
"paths": {
|
||||
"tailwindcss-language-service/*": ["packages/tailwindcss-language-service/*"]
|
||||
"tailwindcss-language-service/*": ["../packages/tailwindcss-language-service/*"]
|
||||
}
|
||||
},
|
||||
"include": ["src", "packages/tailwindcss-language-service"]
|
||||
"include": ["src", "../packages/tailwindcss-language-service"]
|
||||
}
|
|
@ -1,2 +1 @@
|
|||
/node_modules
|
||||
/dist
|
||||
|
|
|
@ -16,6 +16,7 @@
|
|||
"line-column": "1.0.2",
|
||||
"moo": "0.5.1",
|
||||
"multi-regexp2": "1.0.3",
|
||||
"postcss": "8.2.6",
|
||||
"postcss-selector-parser": "6.0.2",
|
||||
"semver": "7.3.2",
|
||||
"sift-string": "0.0.2",
|
||||
|
@ -25,7 +26,7 @@
|
|||
"vscode-languageserver-textdocument": "1.0.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"postcss": "8.2.6",
|
||||
"prettier": "2.3.0",
|
||||
"tsdx": "0.14.1",
|
||||
"tslib": "2.2.0",
|
||||
"typescript": "4.2.4"
|
||||
|
@ -3550,8 +3551,7 @@
|
|||
"node_modules/colorette": {
|
||||
"version": "1.2.2",
|
||||
"resolved": "https://registry.npmjs.org/colorette/-/colorette-1.2.2.tgz",
|
||||
"integrity": "sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w==",
|
||||
"dev": true
|
||||
"integrity": "sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w=="
|
||||
},
|
||||
"node_modules/combined-stream": {
|
||||
"version": "1.0.8",
|
||||
|
@ -8621,7 +8621,6 @@
|
|||
"version": "3.1.22",
|
||||
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.22.tgz",
|
||||
"integrity": "sha512-/2ZUaJX2ANuLtTvqTlgqBQNJoQO398KyJgZloL0PZkC0dpysjncRUPsFe3DUPzz/y3h+u7C46np8RMuvF3jsSQ==",
|
||||
"dev": true,
|
||||
"bin": {
|
||||
"nanoid": "bin/nanoid.cjs"
|
||||
},
|
||||
|
@ -9439,7 +9438,6 @@
|
|||
"version": "8.2.6",
|
||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.2.6.tgz",
|
||||
"integrity": "sha512-xpB8qYxgPuly166AGlpRjUdEYtmOWx2iCwGmrv4vqZL9YPVviDVPZPRXxnXr6xPZOdxQ9lp3ZBFCRgWJ7LE3Sg==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"colorette": "^1.2.1",
|
||||
"nanoid": "^3.1.20",
|
||||
|
@ -9470,7 +9468,6 @@
|
|||
"version": "0.6.1",
|
||||
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
|
||||
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
|
@ -9485,15 +9482,15 @@
|
|||
}
|
||||
},
|
||||
"node_modules/prettier": {
|
||||
"version": "1.19.1",
|
||||
"resolved": "https://registry.npmjs.org/prettier/-/prettier-1.19.1.tgz",
|
||||
"integrity": "sha512-s7PoyDv/II1ObgQunCbB9PdLmUcBZcnWOcxDh7O0N/UwDEsHyqkW+Qh28jW+mVuCdx7gLB0BotYI1Y6uI9iyew==",
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmjs.org/prettier/-/prettier-2.3.0.tgz",
|
||||
"integrity": "sha512-kXtO4s0Lz/DW/IJ9QdWhAf7/NmPWQXkFr/r/WkR3vyI+0v8amTDxiaQSLzs8NBlytfLWX/7uQUMIW677yLKl4w==",
|
||||
"dev": true,
|
||||
"bin": {
|
||||
"prettier": "bin-prettier.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=4"
|
||||
"node": ">=10.13.0"
|
||||
}
|
||||
},
|
||||
"node_modules/prettier-linter-helpers": {
|
||||
|
@ -11876,6 +11873,18 @@
|
|||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/tsdx/node_modules/prettier": {
|
||||
"version": "1.19.1",
|
||||
"resolved": "https://registry.npmjs.org/prettier/-/prettier-1.19.1.tgz",
|
||||
"integrity": "sha512-s7PoyDv/II1ObgQunCbB9PdLmUcBZcnWOcxDh7O0N/UwDEsHyqkW+Qh28jW+mVuCdx7gLB0BotYI1Y6uI9iyew==",
|
||||
"dev": true,
|
||||
"bin": {
|
||||
"prettier": "bin-prettier.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=4"
|
||||
}
|
||||
},
|
||||
"node_modules/tsdx/node_modules/supports-color": {
|
||||
"version": "7.2.0",
|
||||
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
|
||||
|
@ -15424,8 +15433,7 @@
|
|||
"colorette": {
|
||||
"version": "1.2.2",
|
||||
"resolved": "https://registry.npmjs.org/colorette/-/colorette-1.2.2.tgz",
|
||||
"integrity": "sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w==",
|
||||
"dev": true
|
||||
"integrity": "sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w=="
|
||||
},
|
||||
"combined-stream": {
|
||||
"version": "1.0.8",
|
||||
|
@ -19372,8 +19380,7 @@
|
|||
"nanoid": {
|
||||
"version": "3.1.22",
|
||||
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.22.tgz",
|
||||
"integrity": "sha512-/2ZUaJX2ANuLtTvqTlgqBQNJoQO398KyJgZloL0PZkC0dpysjncRUPsFe3DUPzz/y3h+u7C46np8RMuvF3jsSQ==",
|
||||
"dev": true
|
||||
"integrity": "sha512-/2ZUaJX2ANuLtTvqTlgqBQNJoQO398KyJgZloL0PZkC0dpysjncRUPsFe3DUPzz/y3h+u7C46np8RMuvF3jsSQ=="
|
||||
},
|
||||
"nanomatch": {
|
||||
"version": "1.2.13",
|
||||
|
@ -19999,7 +20006,6 @@
|
|||
"version": "8.2.6",
|
||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.2.6.tgz",
|
||||
"integrity": "sha512-xpB8qYxgPuly166AGlpRjUdEYtmOWx2iCwGmrv4vqZL9YPVviDVPZPRXxnXr6xPZOdxQ9lp3ZBFCRgWJ7LE3Sg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"colorette": "^1.2.1",
|
||||
"nanoid": "^3.1.20",
|
||||
|
@ -20009,8 +20015,7 @@
|
|||
"source-map": {
|
||||
"version": "0.6.1",
|
||||
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
|
||||
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
|
||||
"dev": true
|
||||
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g=="
|
||||
}
|
||||
}
|
||||
},
|
||||
|
@ -20031,9 +20036,9 @@
|
|||
"dev": true
|
||||
},
|
||||
"prettier": {
|
||||
"version": "1.19.1",
|
||||
"resolved": "https://registry.npmjs.org/prettier/-/prettier-1.19.1.tgz",
|
||||
"integrity": "sha512-s7PoyDv/II1ObgQunCbB9PdLmUcBZcnWOcxDh7O0N/UwDEsHyqkW+Qh28jW+mVuCdx7gLB0BotYI1Y6uI9iyew==",
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmjs.org/prettier/-/prettier-2.3.0.tgz",
|
||||
"integrity": "sha512-kXtO4s0Lz/DW/IJ9QdWhAf7/NmPWQXkFr/r/WkR3vyI+0v8amTDxiaQSLzs8NBlytfLWX/7uQUMIW677yLKl4w==",
|
||||
"dev": true
|
||||
},
|
||||
"prettier-linter-helpers": {
|
||||
|
@ -21962,6 +21967,12 @@
|
|||
"integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
|
||||
"dev": true
|
||||
},
|
||||
"prettier": {
|
||||
"version": "1.19.1",
|
||||
"resolved": "https://registry.npmjs.org/prettier/-/prettier-1.19.1.tgz",
|
||||
"integrity": "sha512-s7PoyDv/II1ObgQunCbB9PdLmUcBZcnWOcxDh7O0N/UwDEsHyqkW+Qh28jW+mVuCdx7gLB0BotYI1Y6uI9iyew==",
|
||||
"dev": true
|
||||
},
|
||||
"supports-color": {
|
||||
"version": "7.2.0",
|
||||
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
|
||||
|
|
|
@ -24,6 +24,7 @@
|
|||
"line-column": "1.0.2",
|
||||
"moo": "0.5.1",
|
||||
"multi-regexp2": "1.0.3",
|
||||
"postcss": "8.2.6",
|
||||
"postcss-selector-parser": "6.0.2",
|
||||
"semver": "7.3.2",
|
||||
"sift-string": "0.0.2",
|
||||
|
@ -33,7 +34,7 @@
|
|||
"vscode-languageserver-textdocument": "1.0.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"postcss": "8.2.6",
|
||||
"prettier": "2.3.0",
|
||||
"tsdx": "0.14.1",
|
||||
"tslib": "2.2.0",
|
||||
"typescript": "4.2.4"
|
||||
|
|
|
@ -2,15 +2,14 @@ import type { TextDocument, Position } from 'vscode-languageserver'
|
|||
import { isInsideTag, isVueDoc, isSvelteDoc, isHtmlDoc } from './html'
|
||||
import { isJsDoc } from './js'
|
||||
import { State } from './state'
|
||||
|
||||
export const CSS_LANGUAGES = ['css', 'less', 'postcss', 'sass', 'scss', 'stylus', 'sugarss']
|
||||
import { cssLanguages } from './languages'
|
||||
|
||||
export function isCssDoc(state: State, doc: TextDocument): boolean {
|
||||
const userCssLanguages = Object.keys(state.editor.userLanguages).filter((lang) =>
|
||||
CSS_LANGUAGES.includes(state.editor.userLanguages[lang])
|
||||
cssLanguages.includes(state.editor.userLanguages[lang])
|
||||
)
|
||||
|
||||
return [...CSS_LANGUAGES, ...userCssLanguages].indexOf(doc.languageId) !== -1
|
||||
return [...cssLanguages, ...userCssLanguages].indexOf(doc.languageId) !== -1
|
||||
}
|
||||
|
||||
export function isCssContext(state: State, doc: TextDocument, position: Position): boolean {
|
||||
|
|
|
@ -1,44 +1,13 @@
|
|||
import type { TextDocument, Position } from 'vscode-languageserver'
|
||||
import { State } from './state'
|
||||
|
||||
export const HTML_LANGUAGES = [
|
||||
'aspnetcorerazor',
|
||||
'blade',
|
||||
'django-html',
|
||||
'edge',
|
||||
'ejs',
|
||||
'erb',
|
||||
'gohtml',
|
||||
'GoHTML',
|
||||
'haml',
|
||||
'handlebars',
|
||||
'hbs',
|
||||
'html',
|
||||
'HTML (Eex)',
|
||||
'HTML (EEx)',
|
||||
'html-eex',
|
||||
'jade',
|
||||
'leaf',
|
||||
'liquid',
|
||||
'markdown',
|
||||
'mdx',
|
||||
'mustache',
|
||||
'njk',
|
||||
'nunjucks',
|
||||
'php',
|
||||
'razor',
|
||||
'slim',
|
||||
'twig',
|
||||
]
|
||||
import { htmlLanguages } from './languages'
|
||||
|
||||
export function isHtmlDoc(state: State, doc: TextDocument): boolean {
|
||||
const userHtmlLanguages = Object.keys(
|
||||
state.editor.userLanguages
|
||||
).filter((lang) => HTML_LANGUAGES.includes(state.editor.userLanguages[lang]))
|
||||
|
||||
return (
|
||||
[...HTML_LANGUAGES, ...userHtmlLanguages].indexOf(doc.languageId) !== -1
|
||||
const userHtmlLanguages = Object.keys(state.editor.userLanguages).filter((lang) =>
|
||||
htmlLanguages.includes(state.editor.userLanguages[lang])
|
||||
)
|
||||
|
||||
return [...htmlLanguages, ...userHtmlLanguages].indexOf(doc.languageId) !== -1
|
||||
}
|
||||
|
||||
export function isVueDoc(doc: TextDocument): boolean {
|
||||
|
@ -49,11 +18,7 @@ export function isSvelteDoc(doc: TextDocument): boolean {
|
|||
return doc.languageId === 'svelte'
|
||||
}
|
||||
|
||||
export function isHtmlContext(
|
||||
state: State,
|
||||
doc: TextDocument,
|
||||
position: Position
|
||||
): boolean {
|
||||
export function isHtmlContext(state: State, doc: TextDocument, position: Position): boolean {
|
||||
let str = doc.getText({
|
||||
start: { line: 0, character: 0 },
|
||||
end: position,
|
||||
|
|
|
@ -1,29 +1,17 @@
|
|||
import type { TextDocument, Position } from 'vscode-languageserver'
|
||||
import { isHtmlDoc, isInsideTag, isVueDoc, isSvelteDoc } from './html'
|
||||
import { State } from './state'
|
||||
|
||||
export const JS_LANGUAGES = [
|
||||
'javascript',
|
||||
'javascriptreact',
|
||||
'reason',
|
||||
'rescript',
|
||||
'typescript',
|
||||
'typescriptreact',
|
||||
]
|
||||
import { jsLanguages } from './languages'
|
||||
|
||||
export function isJsDoc(state: State, doc: TextDocument): boolean {
|
||||
const userJsLanguages = Object.keys(
|
||||
state.editor.userLanguages
|
||||
).filter((lang) => JS_LANGUAGES.includes(state.editor.userLanguages[lang]))
|
||||
const userJsLanguages = Object.keys(state.editor.userLanguages).filter((lang) =>
|
||||
jsLanguages.includes(state.editor.userLanguages[lang])
|
||||
)
|
||||
|
||||
return [...JS_LANGUAGES, ...userJsLanguages].indexOf(doc.languageId) !== -1
|
||||
return [...jsLanguages, ...userJsLanguages].indexOf(doc.languageId) !== -1
|
||||
}
|
||||
|
||||
export function isJsContext(
|
||||
state: State,
|
||||
doc: TextDocument,
|
||||
position: Position
|
||||
): boolean {
|
||||
export function isJsContext(state: State, doc: TextDocument, position: Position): boolean {
|
||||
if (isJsDoc(state, doc)) {
|
||||
return true
|
||||
}
|
||||
|
|
|
@ -1,5 +1,4 @@
|
|||
export const DEFAULT_LANGUAGES = [
|
||||
// html
|
||||
export const htmlLanguages = [
|
||||
'aspnetcorerazor',
|
||||
'blade',
|
||||
'django-html',
|
||||
|
@ -27,22 +26,19 @@ export const DEFAULT_LANGUAGES = [
|
|||
'razor',
|
||||
'slim',
|
||||
'twig',
|
||||
// css
|
||||
'css',
|
||||
'less',
|
||||
'postcss',
|
||||
'sass',
|
||||
'scss',
|
||||
'stylus',
|
||||
'sugarss',
|
||||
// js
|
||||
]
|
||||
|
||||
export const cssLanguages = ['css', 'less', 'postcss', 'sass', 'scss', 'stylus', 'sugarss']
|
||||
|
||||
export const jsLanguages = [
|
||||
'javascript',
|
||||
'javascriptreact',
|
||||
'reason',
|
||||
'rescript',
|
||||
'typescript',
|
||||
'typescriptreact',
|
||||
// mixed
|
||||
'vue',
|
||||
'svelte',
|
||||
]
|
||||
|
||||
export const specialLanguages = ['vue', 'svelte']
|
||||
|
||||
export const languages = [...cssLanguages, ...htmlLanguages, ...jsLanguages, ...specialLanguages]
|
Before Width: | Height: | Size: 256 KiB After Width: | Height: | Size: 256 KiB |
Before Width: | Height: | Size: 90 KiB After Width: | Height: | Size: 90 KiB |
Before Width: | Height: | Size: 235 KiB After Width: | Height: | Size: 235 KiB |
Before Width: | Height: | Size: 267 KiB After Width: | Height: | Size: 267 KiB |
|
@ -0,0 +1 @@
|
|||
/dist
|
|
@ -0,0 +1,125 @@
|
|||
<img src="https://raw.githubusercontent.com/bradlc/vscode-tailwindcss/master/packages/vscode-tailwindcss/.github/banner-dark.png" alt="" />
|
||||
|
||||
Tailwind CSS IntelliSense enhances the Tailwind development experience by providing Visual Studio Code users with advanced features such as autocomplete, syntax highlighting, and linting.
|
||||
|
||||
## Installation
|
||||
|
||||
**[Install via the Visual Studio Code Marketplace →](https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss)**
|
||||
|
||||
In order for the extension to activate you must have [`tailwindcss` installed](https://tailwindcss.com/docs/installation) and a [Tailwind config file](https://tailwindcss.com/docs/installation#create-your-configuration-file) named `tailwind.config.js` in your workspace.
|
||||
|
||||
## Features
|
||||
|
||||
### Autocomplete
|
||||
|
||||
Intelligent suggestions for class names, as well as [CSS functions and directives](https://tailwindcss.com/docs/functions-and-directives/).
|
||||
|
||||
<img src="https://raw.githubusercontent.com/bradlc/vscode-tailwindcss/master/packages/vscode-tailwindcss/.github/autocomplete.png" alt="" />
|
||||
|
||||
### Linting
|
||||
|
||||
Highlights errors and potential bugs in both your CSS and your markup.
|
||||
|
||||
<img src="https://raw.githubusercontent.com/bradlc/vscode-tailwindcss/master/packages/vscode-tailwindcss/.github/linting.png" alt="" />
|
||||
|
||||
### Hover Preview
|
||||
|
||||
See the complete CSS for a Tailwind class name by hovering over it.
|
||||
|
||||
<img src="https://raw.githubusercontent.com/bradlc/vscode-tailwindcss/master/packages/vscode-tailwindcss/.github/hover.png" alt="" />
|
||||
|
||||
### CSS Syntax Highlighting
|
||||
|
||||
Provides syntax definitions so that Tailwind features are highlighted correctly.
|
||||
|
||||
## Recommended VS Code Settings
|
||||
|
||||
VS Code has built-in CSS validation which may display errors when using Tailwind-specific syntax, such as `@apply`. You can disable this with the `css.validate` setting:
|
||||
|
||||
```
|
||||
"css.validate": false
|
||||
```
|
||||
|
||||
By default VS Code will not trigger completions when editing "string" content, for example within JSX attribute values. Updating the `editor.quickSuggestions` setting may improve your experience:
|
||||
|
||||
```
|
||||
"editor.quickSuggestions": {
|
||||
"strings": true
|
||||
}
|
||||
```
|
||||
|
||||
## Extension Settings
|
||||
|
||||
### `tailwindCSS.includeLanguages`
|
||||
|
||||
This setting allows you to add additional language support. The key of each entry is the new language ID and the value is any one of the extensions built-in languages, depending on how you want the new language to be treated (e.g. `html`, `css`, or `javascript`):
|
||||
|
||||
```json
|
||||
{
|
||||
"tailwindCSS.includeLanguages": {
|
||||
"plaintext": "html"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### `tailwindCSS.emmetCompletions`
|
||||
|
||||
Enable completions when using [Emmet](https://emmet.io/)-style syntax, for example `div.bg-red-500.uppercase`. **Default: `false`**
|
||||
|
||||
### `tailwindCSS.colorDecorators`
|
||||
|
||||
Controls whether the editor should render inline color decorators for Tailwind CSS classes and helper functions. **Default: `true`**
|
||||
|
||||
> Note that `editor.colorDecorators` must be enabled for color decorators to be shown.
|
||||
|
||||
### `tailwindCSS.showPixelEquivalents`
|
||||
|
||||
Show `px` equivalents for `rem` CSS values in completions and hovers. **Default: `true`**
|
||||
|
||||
### `tailwindCSS.rootFontSize`
|
||||
|
||||
Root font size in pixels. Used to convert `rem` CSS values to their `px` equivalents. See [`tailwindCSS.showPixelEquivalents`](#tailwindcssshowpixelequivalents). **Default: `16`**
|
||||
|
||||
### `tailwindCSS.validate`
|
||||
|
||||
Enable linting. Rules can be configured individually using the `tailwindcss.lint` settings:
|
||||
|
||||
- `ignore`: disable lint rule entirely
|
||||
- `warning`: rule violations will be considered "warnings," typically represented by a yellow underline
|
||||
- `error`: rule violations will be considered "errors," typically represented by a red underline
|
||||
|
||||
#### `tailwindCSS.lint.invalidScreen`
|
||||
|
||||
Unknown screen name used with the [`@screen` directive](https://tailwindcss.com/docs/functions-and-directives/#screen). **Default: `error`**
|
||||
|
||||
#### `tailwindCSS.lint.invalidVariant`
|
||||
|
||||
Unknown variant name used with the [`@variants` directive](https://tailwindcss.com/docs/functions-and-directives/#variants). **Default: `error`**
|
||||
|
||||
#### `tailwindCSS.lint.invalidTailwindDirective`
|
||||
|
||||
Unknown value used with the [`@tailwind` directive](https://tailwindcss.com/docs/functions-and-directives/#tailwind). **Default: `error`**
|
||||
|
||||
#### `tailwindCSS.lint.invalidApply`
|
||||
|
||||
Unsupported use of the [`@apply` directive](https://tailwindcss.com/docs/functions-and-directives/#apply). **Default: `error`**
|
||||
|
||||
#### `tailwindCSS.lint.invalidConfigPath`
|
||||
|
||||
Unknown or invalid path used with the [`theme` helper](https://tailwindcss.com/docs/functions-and-directives/#theme). **Default: `error`**
|
||||
|
||||
#### `tailwindCSS.lint.cssConflict`
|
||||
|
||||
Class names on the same HTML element which apply the same CSS property or properties. **Default: `warning`**
|
||||
|
||||
#### `tailwindCSS.lint.recommendedVariantOrder`
|
||||
|
||||
Class variants not in the recommended order (applies in [JIT mode](https://tailwindcss.com/docs/just-in-time-mode) only). **Default: `warning`**
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
If you’re having issues getting the IntelliSense features to activate, there are a few things you can check:
|
||||
|
||||
- Ensure that you have a Tailwind config file in your workspace and that this is named `tailwind.config.js`. Check out the Tailwind documentation for details on [creating a config file](https://tailwindcss.com/docs/installation#create-your-configuration-file).
|
||||
- Ensure that the `tailwindcss` module is installed in your workspace, via `npm`, `yarn`, or `pnpm`.
|
||||
- Make sure your VS Code settings aren’t causing your Tailwind config file to be excluded from search, for example via the `search.exclude` setting.
|
Before Width: | Height: | Size: 3.9 KiB After Width: | Height: | Size: 3.9 KiB |
|
@ -0,0 +1,207 @@
|
|||
{
|
||||
"name": "vscode-tailwindcss",
|
||||
"displayName": "Tailwind CSS IntelliSense",
|
||||
"description": "Intelligent Tailwind CSS tooling for VS Code",
|
||||
"preview": true,
|
||||
"author": "Brad Cornes <hello@bradley.dev>",
|
||||
"license": "MIT",
|
||||
"version": "0.6.6",
|
||||
"homepage": "https://github.com/tailwindlabs/tailwindcss-intellisense",
|
||||
"bugs": {
|
||||
"url": "https://github.com/tailwindlabs/tailwindcss-intellisense/issues",
|
||||
"email": "hello@bradley.dev"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/tailwindlabs/tailwindcss-intellisense.git"
|
||||
},
|
||||
"publisher": "bradlc",
|
||||
"keywords": [
|
||||
"tailwind",
|
||||
"tailwindcss",
|
||||
"css",
|
||||
"intellisense",
|
||||
"autocomplete",
|
||||
"vscode"
|
||||
],
|
||||
"engines": {
|
||||
"vscode": "^1.52.0"
|
||||
},
|
||||
"categories": [
|
||||
"Linters",
|
||||
"Other"
|
||||
],
|
||||
"galleryBanner": {
|
||||
"color": "#f9fafb"
|
||||
},
|
||||
"icon": "media/icon.png",
|
||||
"activationEvents": [
|
||||
"onStartupFinished"
|
||||
],
|
||||
"main": "dist/extension/index.js",
|
||||
"contributes": {
|
||||
"commands": [
|
||||
{
|
||||
"command": "tailwindCSS.showOutput",
|
||||
"title": "Tailwind CSS: Show Output",
|
||||
"enablement": "tailwindCSS.hasOutputChannel"
|
||||
}
|
||||
],
|
||||
"grammars": [
|
||||
{
|
||||
"scopeName": "tailwindcss.injection",
|
||||
"path": "./syntaxes/tailwind.tmLanguage.json",
|
||||
"injectTo": [
|
||||
"source.css",
|
||||
"source.css.scss",
|
||||
"source.css.less",
|
||||
"source.css.postcss",
|
||||
"source.vue",
|
||||
"source.svelte",
|
||||
"text.html"
|
||||
]
|
||||
}
|
||||
],
|
||||
"configuration": {
|
||||
"title": "Tailwind CSS IntelliSense",
|
||||
"properties": {
|
||||
"tailwindCSS.emmetCompletions": {
|
||||
"type": "boolean",
|
||||
"default": false,
|
||||
"markdownDescription": "Enable class name completions when using Emmet-style syntax, for example `div.bg-red-500.uppercase`"
|
||||
},
|
||||
"tailwindCSS.includeLanguages": {
|
||||
"type": "object",
|
||||
"additionalProperties": {
|
||||
"type": "string"
|
||||
},
|
||||
"default": {},
|
||||
"markdownDescription": "Enable features in languages that are not supported by default. Add a mapping here between the new language and an already supported language.\n E.g.: `{\"plaintext\": \"html\"}`"
|
||||
},
|
||||
"tailwindCSS.colorDecorators": {
|
||||
"type": "boolean",
|
||||
"default": true,
|
||||
"markdownDescription": "Controls whether the editor should render inline color decorators for Tailwind CSS classes and helper functions.",
|
||||
"scope": "language-overridable"
|
||||
},
|
||||
"tailwindCSS.validate": {
|
||||
"type": "boolean",
|
||||
"default": true,
|
||||
"markdownDescription": "Enable linting. Rules can be configured individually using the `tailwindcss.lint.*` settings",
|
||||
"scope": "language-overridable"
|
||||
},
|
||||
"tailwindCSS.lint.cssConflict": {
|
||||
"type": "string",
|
||||
"enum": [
|
||||
"ignore",
|
||||
"warning",
|
||||
"error"
|
||||
],
|
||||
"default": "warning",
|
||||
"markdownDescription": "Class names on the same HTML element which apply the same CSS property or properties",
|
||||
"scope": "language-overridable"
|
||||
},
|
||||
"tailwindCSS.lint.invalidApply": {
|
||||
"type": "string",
|
||||
"enum": [
|
||||
"ignore",
|
||||
"warning",
|
||||
"error"
|
||||
],
|
||||
"default": "error",
|
||||
"markdownDescription": "Unsupported use of the [`@apply` directive](https://tailwindcss.com/docs/functions-and-directives/#apply)",
|
||||
"scope": "language-overridable"
|
||||
},
|
||||
"tailwindCSS.lint.invalidScreen": {
|
||||
"type": "string",
|
||||
"enum": [
|
||||
"ignore",
|
||||
"warning",
|
||||
"error"
|
||||
],
|
||||
"default": "error",
|
||||
"markdownDescription": "Unknown screen name used with the [`@screen` directive](https://tailwindcss.com/docs/functions-and-directives/#screen)",
|
||||
"scope": "language-overridable"
|
||||
},
|
||||
"tailwindCSS.lint.invalidVariant": {
|
||||
"type": "string",
|
||||
"enum": [
|
||||
"ignore",
|
||||
"warning",
|
||||
"error"
|
||||
],
|
||||
"default": "error",
|
||||
"markdownDescription": "Unknown variant name used with the [`@variants` directive](https://tailwindcss.com/docs/functions-and-directives/#variants)",
|
||||
"scope": "language-overridable"
|
||||
},
|
||||
"tailwindCSS.lint.invalidConfigPath": {
|
||||
"type": "string",
|
||||
"enum": [
|
||||
"ignore",
|
||||
"warning",
|
||||
"error"
|
||||
],
|
||||
"default": "error",
|
||||
"markdownDescription": "Unknown or invalid path used with the [`theme` helper](https://tailwindcss.com/docs/functions-and-directives/#theme)",
|
||||
"scope": "language-overridable"
|
||||
},
|
||||
"tailwindCSS.lint.invalidTailwindDirective": {
|
||||
"type": "string",
|
||||
"enum": [
|
||||
"ignore",
|
||||
"warning",
|
||||
"error"
|
||||
],
|
||||
"default": "error",
|
||||
"markdownDescription": "Unknown value used with the [`@tailwind` directive](https://tailwindcss.com/docs/functions-and-directives/#tailwind)",
|
||||
"scope": "language-overridable"
|
||||
},
|
||||
"tailwindCSS.lint.recommendedVariantOrder": {
|
||||
"type": "string",
|
||||
"enum": [
|
||||
"ignore",
|
||||
"warning",
|
||||
"error"
|
||||
],
|
||||
"default": "warning",
|
||||
"markdownDescription": "Class variants not in the recommended order (applies in [JIT mode](https://tailwindcss.com/docs/just-in-time-mode) only)",
|
||||
"scope": "language-overridable"
|
||||
},
|
||||
"tailwindCSS.experimental.classRegex": {
|
||||
"type": "array",
|
||||
"scope": "language-overridable"
|
||||
},
|
||||
"tailwindCSS.showPixelEquivalents": {
|
||||
"type": "boolean",
|
||||
"default": true,
|
||||
"markdownDescription": "Show `px` equivalents for `rem` CSS values."
|
||||
},
|
||||
"tailwindCSS.rootFontSize": {
|
||||
"type": "number",
|
||||
"default": 16,
|
||||
"markdownDescription": "Root font size in pixels. Used to convert `rem` CSS values to their `px` equivalents. See `#tailwindCSS.showPixelEquivalents#`."
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"scripts": {
|
||||
"dev": "npm run clean && glob-exec --foreach --parallel \"src/*.ts\" -- \"ncc build {{file}} --watch -o dist/{{file.toString().replace(/^src\\//, '').replace(/\\.ts$/, '')}}\"",
|
||||
"build": "npm run clean && glob-exec --foreach --parallel \"src/*.ts\" -- \"ncc build {{file}} -o dist/{{file.toString().replace(/^src\\//, '').replace(/\\.ts$/, '')}}\" && mv dist/server/index.js dist/server/tailwindServer.js && npm run minify",
|
||||
"minify": "glob-exec --foreach --parallel \"dist/**/*.js\" -- \"terser {{file}} --compress --mangle --output {{file.toString()}}\"",
|
||||
"package": "vsce package",
|
||||
"publish": "vsce publish",
|
||||
"vscode:prepublish": "npm run build",
|
||||
"clean": "rimraf dist",
|
||||
"test": "jest"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@ctrl/tinycolor": "3.1.4",
|
||||
"@types/vscode": "1.56.0",
|
||||
"@vercel/ncc": "0.28.4",
|
||||
"glob-exec": "0.1.1",
|
||||
"rimraf": "3.0.2",
|
||||
"terser": "4.6.12",
|
||||
"vsce": "1.87.0",
|
||||
"vscode-languageclient": "7.0.0"
|
||||
}
|
||||
}
|
|
@ -27,8 +27,8 @@ import {
|
|||
State as LanguageClientState,
|
||||
RevealOutputChannelOn,
|
||||
} from 'vscode-languageclient/node'
|
||||
import { DEFAULT_LANGUAGES } from './lib/languages'
|
||||
import isObject from './util/isObject'
|
||||
import { languages as defaultLanguages } from 'tailwindcss-language-service/src/util/languages'
|
||||
import isObject from 'tailwindcss-language-service/src/util/isObject'
|
||||
import { dedupe, equal } from 'tailwindcss-language-service/src/util/array'
|
||||
import { names as namedColors } from '@ctrl/tinycolor'
|
||||
|
||||
|
@ -83,6 +83,7 @@ function getUserLanguages(folder?: WorkspaceFolder): Record<string, string> {
|
|||
}
|
||||
|
||||
export async function activate(context: ExtensionContext) {
|
||||
console.log(Uri.parse(`command:editor.action.addCommentLine`).toString())
|
||||
let module = context.asAbsolutePath(path.join('dist', 'server', 'index.js'))
|
||||
let prod = path.join('dist', 'server', 'tailwindServer.js')
|
||||
|
||||
|
@ -126,7 +127,7 @@ export async function activate(context: ExtensionContext) {
|
|||
const userLanguages = getUserLanguages(folder)
|
||||
if (userLanguages) {
|
||||
const userLanguageIds = Object.keys(userLanguages)
|
||||
const newLanguages = dedupe([...DEFAULT_LANGUAGES, ...userLanguageIds])
|
||||
const newLanguages = dedupe([...defaultLanguages, ...userLanguageIds])
|
||||
if (!equal(newLanguages, languages.get(folder.uri.toString()))) {
|
||||
languages.set(folder.uri.toString(), newLanguages)
|
||||
|
||||
|
@ -168,7 +169,7 @@ export async function activate(context: ExtensionContext) {
|
|||
if (!languages.has(folder.uri.toString())) {
|
||||
languages.set(
|
||||
folder.uri.toString(),
|
||||
dedupe([...DEFAULT_LANGUAGES, ...Object.keys(getUserLanguages(folder))])
|
||||
dedupe([...defaultLanguages, ...Object.keys(getUserLanguages(folder))])
|
||||
)
|
||||
}
|
||||
|
||||
|
@ -199,6 +200,15 @@ export async function activate(context: ExtensionContext) {
|
|||
outputChannel: outputChannel,
|
||||
revealOutputChannelOn: RevealOutputChannelOn.Never,
|
||||
middleware: {
|
||||
async provideHover(document, position, token, next) {
|
||||
let result = await next(document, position, token)
|
||||
result.contents = result.contents.map((content) => {
|
||||
// @ts-ignore
|
||||
content.isTrusted = true
|
||||
return content
|
||||
})
|
||||
return result
|
||||
},
|
||||
async resolveCompletionItem(item, token, next) {
|
||||
let result = await next(item, token)
|
||||
let selections = Window.activeTextEditor.selections
|
|
@ -0,0 +1 @@
|
|||
import 'tailwindcss-language-server/src/server'
|
|
@ -0,0 +1,23 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"module": "commonjs",
|
||||
"target": "es6",
|
||||
"lib": ["ES2019"],
|
||||
"rootDir": "..",
|
||||
"sourceMap": true,
|
||||
"moduleResolution": "node",
|
||||
"esModuleInterop": true,
|
||||
"allowJs": true,
|
||||
"resolveJsonModule": true,
|
||||
"baseUrl": "..",
|
||||
"paths": {
|
||||
"tailwindcss-language-service/*": ["../packages/tailwindcss-language-service/*"],
|
||||
"tailwindcss-language-server/*": ["../packages/tailwindcss-language-server/*"]
|
||||
}
|
||||
},
|
||||
"include": [
|
||||
"src",
|
||||
"../packages/tailwindcss-language-service",
|
||||
"../packages/tailwindcss-language-server"
|
||||
]
|
||||
}
|
|
@ -1,3 +0,0 @@
|
|||
export default function isObject(variable: any): boolean {
|
||||
return Object.prototype.toString.call(variable) === '[object Object]'
|
||||
}
|
|
@ -1,5 +0,0 @@
|
|||
import * as util from 'util'
|
||||
|
||||
export function logFull(object: any): void {
|
||||
console.log(util.inspect(object, { showHidden: false, depth: null }))
|
||||
}
|