/laravel-vue-tailwind

Example repo to show setup for Laravel 8, Vue 2~, and Tailwind 2

Primary LanguagePHP

Laravel-Vue-Tailwind

Helps you get started by allowing you to analyze the project and config settings.

Installation

$ git clone https://github.com/agm1984/laravel-vue-tailwind.git

$ cd laravel-vue-tailwind

$ valet link

$ valet secure

From Zero

# make a laravel app
$ laravel new example-app

# install vue
$ composer require laravel/ui

$ php artisan ui vue

# add auth
$ php artisan ui vue --auth

$ npm install

$ npm run watch

With Tailwind

$ npm install --save-dev tailwindcss

$ npx tailwindcss init

Add files to purge

In tailwind.config.js,

    purge: [
        'resources/views/**/*.blade.php',
        'resources/js/**/*.js',
    ],

Tailwind in production

By default, Tailwind looks for the config file in the root of the project directory, so it's not required anymore to explicitly declare it in webpack.mix.js.

Database

$ mysql -u root -p
CREATE DATABASE tailwindauth;

CREATE USER 'tailwindauth'@'localhost' IDENTIFIED BY 'tailwindauth';

GRANT ALL PRIVILEGES ON tailwindauth.* TO 'tailwindauth'@'localhost';

Don't forget to add the users table:

$ php artisan migrate