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

# Installations

**Requirements**

1. [PHP](https://www.apachefriends.org/download.html) >= 7.4.0&#x20;
2. [Composer ](https://getcomposer.org/)
3. [nodejs ](https://nodejs.org/en)Recommended version: for **tailwindcss** package&#x20;

**Installation**&#x20;

You can install the package via composer:

```sh
composer require turbotech/turbotech-component
```

**Config/app.php**

Inside `providers` of `config/app.php`

```php
'providers' => [

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

**composer.json**

Inside `providers` of `composer.json`

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

**If the project haven't tailwindcss package**&#x20;

Then you need to install \`tailwindcss\` package

```sh
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._

<pre class="language-javascript"><code class="lang-javascript"><strong>/** @type {import('tailwindcss').Config} */
</strong>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: [],
}
</code></pre>

**Add the Tailwind directives to your CSS**

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

```css
@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.

```javascript
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`.

```sh
npm run watch
```

