Memulai Project dengan Tailwind CSS

Tailwind CSS merupakan kerangka css paling dasar yang mudah disesuaikan karna memberikan semua komponen yang dibutuhkan untuk membangun desain yang diinginkan.

Untuk bisa memulai project dengan tailwind css kita memerlukan beberapa settingan atau config , berikut beberapa tahap yang bisa diikuti.

1. Persiapkan beberapa Tools di bawah ini
- Laravel Mix
- Post CSS

2. Lakukan perintah berikut

Install Laravel Mix

mkdir my-app && cd my-app
npm init -y
npm install laravel-mix --save-dev
cp node_modules/laravel-mix/setup/webpack.mix.js ./

"scripts": {
    "dev": "npm run development",
    "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch": "npm run development -- --watch",
    "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
    "prod": "npm run production",
    "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
}

npm install cross-env --save-dev

sumber:
laravel-mix[.]com/docs/5.0/installation