“Thiết kế trong DevTools” cho Tailwind CSS ⚡️
Tailwind CSS v3.0 đã được bật Just-in-Time mặc định, mang lại cải thiện về hiệu suất đáng kể, nhưng vì lớp được tạo ra theo yêu cầu dựa trên mã nguồn của bạn, việc thêm một số lớp không sử dụng trực tiếp trong DevTools bây giờ là không thể, điều này có thể hơi khó chịu.
May mắn thay, plugin này có thể giúp chúng ta thử nghiệm bất kỳ tiện ích tailwind nào trong DevTools, và điều quan trọng là plugin này được truyền cảm hứng từ Windi CSS, và tên “Thiết kế trong devtool” cũng được học từ tài liệu của Windi CSS, nhờ vào các gói vite-plugin-windicss và webpack-plugin-windicss tuyệt vời ✨
Ví dụ về tailwind-css-webpack-plugin – Nhấp để Xem!”
Tính năng
- 🛠️ Không cần cấu hình để bắt đầu
- ⚡️ Chế độ “Design in DevTools”
- 🎨 Visualizing your Tailwind CSS configuration file.
- ⚙️ Tự động chèn các chỉ thị @tailwind
- 📦 Không cần thêm tailwind vào các plugin PostCSS
- 🔥 Độc lập với trình đóng gói: Webpack,Vite, v.v.!
- 🚀 Độc lập với framework: Vue CLI, Next.js, Create React App, v.v.!
Bắt đầu Nhanh
|
—|—
tailwindcss-vite-plugin| Tailwind CSS “Thiết kế trong DevTools” cho Vite
tailwindcss-webpack-plugin| Tailwind CSS “Thiết kế trong DevTools” cho Webpack
Chi tiết tải xuống:
Tác giả: await-ovo
Nguồn: https://github.com/await-ovo/tailwindcss-webpack-plugin
Giấy phép: MIT license
Cảm ơn bạn!