Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/JeffreyWay/laravel-mix-tailwind
mix.tailwind()
https://github.com/JeffreyWay/laravel-mix-tailwind
Last synced: about 1 month ago
JSON representation
mix.tailwind()
- Host: GitHub
- URL: https://github.com/JeffreyWay/laravel-mix-tailwind
- Owner: JeffreyWay
- Created: 2018-03-16T21:32:39.000Z (almost 7 years ago)
- Default Branch: master
- Last Pushed: 2021-01-26T16:39:42.000Z (almost 4 years ago)
- Last Synced: 2024-11-12T19:14:34.206Z (about 1 month ago)
- Language: JavaScript
- Size: 10.7 KB
- Stars: 347
- Watchers: 7
- Forks: 25
- Open Issues: 7
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Laravel Mix Tailwind
This extension provides instant Tailwind support to your Mix (v2.1 and up) builds.
## Usage
First, install the extension.
```
npm install laravel-mix-tailwind --save-dev
```Then, require it within your `webpack.mix.js` file, like so:
```js
let mix = require('laravel-mix');require('laravel-mix-tailwind');
mix
.js('resources/js/app.js', 'public/js')
.less('resources/less/app.less', 'public/css')
.tailwind();
```## Next steps
This package requries tailwind.js, so don't forget to run:
```
npx tailwindcss init tailwind.js
npm run dev
```app.scss file example:
```
@import "tailwindcss/base";
@import "tailwindcss/components";
@import "tailwindcss/utilities";
```And you're done! Compile everything down with `npm run dev`
[More information about the Tailwind directives](https://tailwindcss.com/docs/installation#3-use-tailwind-in-your-css) to your Sass/Less/Stylus entry file.)