1.1.1 • Published 3 years ago

tailbuild v1.1.1

Weekly downloads
-
License
MIT
Repository
-
Last release
3 years ago

♻️ tailbuild

A simple command to build a JIT Tailwind CSS file for your project without all the fuss.

Run the following command and you're off!

npx tailbuild [output file] --files=[files to search for CSS classes in and generate Tailwind from]

Here's a specific example where tailbuild will scour all the HTML files in the public/ directory for Tailwind classes and build a custom CSS file: dist/tailwind.css

npx tailbuild dist/tailwind.css --files="./public/**/*.html"

File Watching

You can configure tailbuild to watch these "markup reference" files and re-build if they are changed with the --watch option:

npx tailbuild dist/tailwind.css --files="./public/**/*.html" --watch

Production Builds

By adding --production tailbuild will minify the output CSS file.

npx tailbuild dist/tailwind.css --files="./public/**/*.html" --production

Framework Examples

FrameworkExample Command
Laravelnpx tailbuild public/css/tailwind.css --files="resources/views/**/*.blade.php"
Your Favorite FrameworkOpen A PR!

Command Options

OptionsDescription
-o, --outputThe file path to store tailbuild's output Tailwind CSS file
-f, --files, --purgeSpecify (optionally multiple) glob patterns or files to use as a purge reference and a file watcher list if using --watch
-w, --watchWatch all purge reference files for changes and re-build the CSS output
-i, --inputSpecify a CSS input file (containing @tailwind base, etc...) for tailbuild to use as the basis for it's PostCSS build
-c, --configSpecify a custom Tailwind config file for reference when building the Tailwind CSS output file
-m, --minifyMinify all CSS output files using cssnano
--productionMinify all CSS output AND set NODE_ENV to "production" for other optimizations within Tailwind

How It Works

Tailbuild's pretty simple. Take a look at its only file of code for info: tailbuild.js

Enjoy!