Acidic9 / Prettier Plugin Tailwind
Licence: mit
Sort tailwind classes in HTML with Prettier.
Stars: ✭ 192
Programming Languages
typescript
32286 projects
Projects that are alternatives of or similar to Prettier Plugin Tailwind
Git History
Quickly browse the history of a file from any git repository
Stars: ✭ 12,676 (+6502.08%)
Mutual labels: vscode
Vscode Jest
The optimal flow for Jest based testing in VS Code
Stars: ✭ 2,357 (+1127.6%)
Mutual labels: vscode
Vscode Java Test
Run and debug Java test cases in Visual Studio Code.
Stars: ✭ 177 (-7.81%)
Mutual labels: vscode
React Conf 17 Videos
Find that one presentation you missed!
Stars: ✭ 182 (-5.21%)
Mutual labels: prettier
Lad
👦 Lad is the best Node.js framework. Made by a former Express TC and Koa team member.
Stars: ✭ 2,112 (+1000%)
Mutual labels: prettier
Init.nvim
An Opinionated Neovim Config for the Minimalists
Stars: ✭ 194 (+1.04%)
Mutual labels: prettier
Eslint Config Wesbos
No-Sweat™ Eslint and Prettier Setup - with or without VS Code
Stars: ✭ 2,293 (+1094.27%)
Mutual labels: prettier
Stylelint Prettier
Stylelint plugin for Prettier formatting
Stars: ✭ 188 (-2.08%)
Mutual labels: prettier
Vscode Chrome Debug
Debug your JavaScript code running in Google Chrome from VS Code.
Stars: ✭ 2,126 (+1007.29%)
Mutual labels: vscode
Doctorpretty
Wadler's "A prettier printer" embedded pretty-printer DSL for Swift
Stars: ✭ 186 (-3.12%)
Mutual labels: prettier
Langserver Swift
A Swift implementation of the open Language Server Protocol.
Stars: ✭ 171 (-10.94%)
Mutual labels: vscode
Night Owl Vscode Theme
🌌 NIGHT OWL: A VS Code dark theme for contrast for nighttime coding, 🦉 LIGHT OWL: a daytime light theme
Stars: ✭ 2,368 (+1133.33%)
Mutual labels: vscode
Vscodium
binary releases of VS Code without MS branding/telemetry/licensing
Stars: ✭ 14,639 (+7524.48%)
Mutual labels: vscode
Codetour
VS Code extension that allows you to record and playback guided tours of codebases, directly within the editor.
Stars: ✭ 1,139 (+493.23%)
Mutual labels: vscode
Mullet
Mullet Stack: Facebook in the front. Walmart in the back. (React, Hapijs, Node)
Stars: ✭ 194 (+1.04%)
Mutual labels: prettier
Vscode Azurefunctions
Azure Functions extension for VS Code
Stars: ✭ 191 (-0.52%)
Mutual labels: vscode
Prettier Plugin Tailwind
Sort tailwind classes with Prettier.
Supports
- HTML
- CSS (@apply directive)
- ReactJS (JSX, TSX)
- VueJS
- twin.marco
Go from this:
<div class="z-50 z-10 container text-left md:text-center justify-center">
...
</div>
To this:
<div class="container justify-center text-left z-10 z-50 md:text-center">
...
</div>
This plugin reads your tailwind.config.js
to sort tailwind classes in your project.
Installation VSCode
Install Prettier and the plugin into your project locally:
yarn add --dev prettier prettier-plugin-tailwind
Other IDE's are supported.
Note: Prettier 2.0.0 or greater is required as a peer dependency.
Prettier Options
These options can be set in your .prettierrc
file to change the behavious of this plugin.
-
twConfig
- Path to tailwind config relative to the root of the project. -
twPluginsOrder
- Comma separated order of tailwind plugins to sort classes by. -
twClassesPosition
- Position of component and utility classes. -
twUnknownClassesPosition
- Position of unknown classes. -
twJsxClassAttributes
- Comma separated list of JSX attributes to sort tailwind classes in. -
twSortFunctions
- Comma separated list of function names to sort classes in arguments.
More details can be found in OPTIONS.md
Contributing 🙌
Contributions are more than welcome. If you see any changes fit, go ahead and open an issue or PR.
Any support is a huge motivation, thank you very much!
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].