🚀Installations

Installing turbotech/turbotech-component from composer. Follow the requirement to complete installation

Requirements

1. PHP >= 7.4.0

2. Composer

3. nodejs Recommended version: for tailwindcss package

Installation

You can install the package via composer:

composer require turbotech/turbotech-component

Config/app.php

Inside providers of config/app.php

'providers' => [

    /*
    * Laravel Framework Service Providers...
    */
    ...
    TURBOTECH\Component\ServicesProvider::class,
]

composer.json

Inside providers of composer.json

"autoload": {
    "psr-4": {
        ...
        "TURBOTECH\\Component\\": "vendor/turbotech/laravel-component/src"
    }
},

If the project haven't tailwindcss package

Then you need to install `tailwindcss` package

npm install -D tailwindcss postcss autoprefixer
npx tailwindcss init -p

Configure your template paths

Add the paths to all of your template files in your tailwind.config.js file.

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
     "./resources/**/*.blade.php",
     "./resources/**/*.js",
     "./resources/**/*.vue",
     "./vendor/turbotech/**/src/views/*.blade.php",
     "./vendor/turbotech/**/src/views/**/*.blade.php",
     "./vendor/turbotech/**/src/views/**/**/*.blade.php",
     "./vendor/turbotech/**/src/views/**/**/**/*.blade.php",
  ],
  theme: {
    extend: {},
  },
  plugins: [],
}

Add the Tailwind directives to your CSS

Add the @tailwind directives for each of Tailwind’s layers to your ./resources/css/app.css file.

@tailwind base;
@tailwind components;
@tailwind utilities;

Add Tailwind to your Laravel Mix configuration

In your webpack.mix.js file, add tailwindcss as a PostCSS plugin.

mix.js("resources/js/app.js", "public/js")
  .postCss("resources/css/app.css", "public/css", [
    require("tailwindcss"),
]);

Start your build process

Run your build process with npm run watch.

npm run watch