Utility-first, modern CSS for your Vue app using TailwindCSS.
Supports Tailwind v1.0 (follow the migration guide).
Upgrade the plugin's default configuration, then apply your customizations to it:
vue invoke @ky-is/tailwind
inset
to theme extensionspostcss-preset-env
to stage 0 (allows everything to work out of the box, and there's no drawbacks if you aren't using those features)Note that Tailwind v1.0.0-beta.5 has a bug that makes it incompatible with this plugin, so the dependency is pinned to beta.4. This issue is fixed for the next Tailwind beta (see https://github.com/tailwindcss/tailwindcss/pull/858).
<router-link>
, <transition>
, <transition-group>
)@apply
postcss-import
(using ~ syntax to reference node_modules in css @import
)group-hover
variants for visibility
by default.pcss
file supportUpgrading notes: You can delete the "postcss-import"
entry from your package.json
"devDependencies"
.
assets/styles/tailwind
as .postcss
file for better linting/syntax highlighting.