Merge pull request #5 from pktharindu/patch-1

Upgrade to Tailwind 2.x and Mix 6.x. Added support for PHP 8
pktharindu · Jan 1, 2021 · 068629d · 068629d
2 parents afc2ac4 + bc2486a
commit 068629d
Show file tree

Hide file tree

Showing 13 changed files with 86 additions and 64 deletions.
diff --git a/.github/workflows/tests.yml b/.github/workflows/tests.yml
@@ -10,7 +10,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        php: [7.3, 7.4]
+        php: [7.3, 7.4, 8.0]
         laravel: [^8.0]
     name: PHP ${{ matrix.php }} - Laravel ${{ matrix.laravel }}
     steps:

diff --git a/composer.json b/composer.json
@@ -20,9 +20,9 @@
         }
     ],
     "require": {
-        "php": "^7.2.5",
+        "php": "^7.2.5|^8.0",
         "laravel/framework": "^8.0",
-        "laravel/ui": "^2.0",
+        "laravel/ui": "^3.0",
         "livewire/livewire": "^2.0"
     },
     "require-dev": {

diff --git a/src/HandlesGeneralScaffolding.php b/src/HandlesGeneralScaffolding.php
@@ -25,7 +25,7 @@ protected static function updateComposerPackages(bool $dev = true): void
 
         file_put_contents(
             base_path('composer.json'),
-            json_encode($composer, JSON_UNESCAPED_SLASHES | JSON_PRETTY_PRINT) . PHP_EOL
+            json_encode($composer, JSON_UNESCAPED_SLASHES | JSON_PRETTY_PRINT).PHP_EOL
         );
     }
 
@@ -41,26 +41,10 @@ protected static function updateComposerPackageArray(array $composer, string $de
             ], $composer);
     }
 
-    protected static function updatePackagesScripts(): void
-    {
-        if (! file_exists(base_path('package.json'))) {
-            return;
-        }
-
-        $packages = json_decode(file_get_contents(base_path('package.json')), true);
-
-        ksort($packages['scripts']);
-
-        file_put_contents(
-            base_path('package.json'),
-            json_encode($packages, JSON_UNESCAPED_SLASHES | JSON_PRETTY_PRINT) . PHP_EOL
-        );
-    }
-
     protected static function scaffoldDefaults(): void
     {
         $filesystem = new Filesystem();
 
-        $filesystem->copyDirectory(__DIR__ . '/stubs/default', base_path());
+        $filesystem->copyDirectory(__DIR__.'/stubs/default', base_path());
     }
 }
diff --git a/src/TtallPreset.php b/src/TtallPreset.php
@@ -12,12 +12,11 @@ class TtallPreset extends Preset
     use HandlesCodeHelperScaffolding;
 
     const NPM_PACKAGES_TO_ADD = [
-        'autoprefixer' => '^9.8.6',
-        'alpinejs' => '^2.6',
-        'laravel-mix' => '^5.0.9',
-        'postcss' => '^7.0.35',
+        'autoprefixer' => '^10.1.0',
+        'alpinejs' => '^2.8',
+        'postcss' => '^8.2.1',
         'postcss-import' => '^12.0.1',
-        'tailwindcss' => 'npm:@tailwindcss/postcss7-compat@^2.0.1',
+        'tailwindcss' => '^2.0.2',
         'turbolinks' => '^5.2.0',
     ];
 
@@ -30,6 +29,7 @@ class TtallPreset extends Preset
         'eslint-plugin-react' => '^7.20.6',
         'eslint-plugin-react-hooks' => '^4.1.0',
         'prettier' => '^2.0.5',
+        'laravel-mix' => '^6.0.0',
     ];
 
     const NPM_PACKAGES_TO_REMOVE = [
@@ -38,6 +38,22 @@ class TtallPreset extends Preset
         'lodash',
     ];
 
+    const SCRIPTS_TO_ADD = [
+        'development' => 'mix',
+        'watch' => 'mix watch',
+        'watch-poll' => 'mix watch -- --watch-options-poll=1000',
+        'hot' => 'mix watch --hot',
+        'production' => 'mix --production',
+    ];
+
+    const SCRIPTS_TO_REMOVE = [
+        'development',
+        'watch',
+        'watch-poll',
+        'hot',
+        'production',
+    ];
+
     public static function install(): void
     {
         static::updatePackages();
@@ -78,4 +94,25 @@ protected static function updatePackageArray(array $packages, string $dev): arra
             Arr::except($packages, static::NPM_PACKAGES_TO_REMOVE)
         );
     }
+
+    protected static function updatePackagesScripts(): void
+    {
+        if (! file_exists(base_path('package.json'))) {
+            return;
+        }
+
+        $packages = json_decode(file_get_contents(base_path('package.json')), true);
+
+        $packages['scripts'] = array_merge(
+            static::SCRIPTS_TO_ADD,
+            Arr::except($packages['scripts'], static::SCRIPTS_TO_REMOVE)
+        );
+
+        ksort($packages['scripts']);
+
+        file_put_contents(
+            base_path('package.json'),
+            json_encode($packages, JSON_UNESCAPED_SLASHES | JSON_PRETTY_PRINT).PHP_EOL
+        );
+    }
 }
diff --git a/src/stubs/auth/app/Http/Livewire/Auth/Register.php b/src/stubs/auth/app/Http/Livewire/Auth/Register.php
@@ -2,8 +2,8 @@
 
 namespace App\Http\Livewire\Auth;
 
-use App\Providers\RouteServiceProvider;
 use App\Models\User;
+use App\Providers\RouteServiceProvider;
 use Illuminate\Auth\Events\Registered;
 use Illuminate\Support\Facades\Auth;
 use Illuminate\Support\Facades\Hash;

diff --git a/src/stubs/auth/routes/web.php b/src/stubs/auth/routes/web.php
@@ -1,15 +1,15 @@
 <?php
 
-use App\Http\Livewire\Home;
+use App\Http\Controllers\Auth\LoginController;
+use App\Http\Controllers\Auth\VerificationController;
 use App\Http\Livewire\Auth\Login;
-use App\Http\Livewire\Auth\Verify;
-use App\Http\Livewire\Auth\Register;
-use Illuminate\Support\Facades\Route;
+use App\Http\Livewire\Auth\Passwords\Confirm;
 use App\Http\Livewire\Auth\Passwords\Email;
 use App\Http\Livewire\Auth\Passwords\Reset;
-use App\Http\Livewire\Auth\Passwords\Confirm;
-use App\Http\Controllers\Auth\LoginController;
-use App\Http\Controllers\Auth\VerificationController;
+use App\Http\Livewire\Auth\Register;
+use App\Http\Livewire\Auth\Verify;
+use App\Http\Livewire\Home;
+use Illuminate\Support\Facades\Route;
 
 /*
 |--------------------------------------------------------------------------

diff --git a/src/stubs/auth/tests/Feature/Auth/LoginTest.php b/src/stubs/auth/tests/Feature/Auth/LoginTest.php
@@ -2,8 +2,8 @@
 
 namespace Tests\Feature\Auth;
 
-use App\Providers\RouteServiceProvider;
 use App\Models\User;
+use App\Providers\RouteServiceProvider;
 use Illuminate\Foundation\Testing\RefreshDatabase;
 use Illuminate\Support\Facades\Auth;
 use Illuminate\Support\Facades\Hash;

diff --git a/src/stubs/auth/tests/Feature/Auth/RegisterTest.php b/src/stubs/auth/tests/Feature/Auth/RegisterTest.php
@@ -2,8 +2,8 @@
 
 namespace Tests\Feature\Auth;
 
-use App\Providers\RouteServiceProvider;
 use App\Models\User;
+use App\Providers\RouteServiceProvider;
 use Illuminate\Auth\Events\Registered;
 use Illuminate\Foundation\Testing\RefreshDatabase;
 use Illuminate\Support\Facades\Auth;

diff --git a/src/stubs/auth/tests/Feature/Auth/VerifyTest.php b/src/stubs/auth/tests/Feature/Auth/VerifyTest.php
@@ -2,8 +2,8 @@
 
 namespace Tests\Feature\Auth;
 
-use App\Providers\RouteServiceProvider;
 use App\Models\User;
+use App\Providers\RouteServiceProvider;
 use Illuminate\Foundation\Testing\RefreshDatabase;
 use Illuminate\Support\Carbon;
 use Illuminate\Support\Facades\Auth;

diff --git a/src/stubs/default/resources/sass/app.scss → src/stubs/default/resources/css/app.css b/src/stubs/default/resources/sass/app.scss → src/stubs/default/resources/css/app.css
@@ -7,22 +7,15 @@
  */
 @tailwind base;
 
-input:invalid, textarea:invalid, select:invalid {
-    box-shadow: none;
-}
-
 /**
- * x-cloak attributes are removed from elements when Alpine initializes.
- * This is useful for hiding pre-initialized DOM.
+ * Remove the default box-shadow for invalid elements to prevent
+ * inputs in Livewire components showing with a
+ * red border by default in Firefox.
  *
- * See: https://github.com/alpinejs/alpine#x-cloak
+ * See: https://github.com/laravel-frontend-presets/tall/issues/7
  */
-[x-cloak] {
-    display: none !important;
-}
-
-.turbolinks-progress-bar {
-    @apply bg-indigo-500;
+input:invalid, textarea:invalid, select:invalid {
+    box-shadow: none;
 }
 
 /**
@@ -41,6 +34,10 @@ input:invalid, textarea:invalid, select:invalid {
  * .form-input { ... }
  */
 
+.turbolinks-progress-bar {
+    @apply bg-indigo-500;
+}
+
 /**
  * This injects all of Tailwind's utility classes, generated based on your
  * config file.
@@ -56,3 +53,13 @@ input:invalid, textarea:invalid, select:invalid {
  * .bg-pattern-graph-paper { ... }
  * .skew-45 { ... }
  */
+
+ /**
+ * x-cloak attributes are removed from elements when Alpine initializes.
+ * This is useful for hiding pre-initialized DOM.
+ *
+ * See: https://github.com/alpinejs/alpine#x-cloak
+ */
+[x-cloak] {
+    display: none !important;
+}
diff --git a/src/stubs/default/resources/views/layouts/base.blade.php b/src/stubs/default/resources/views/layouts/base.blade.php
@@ -38,6 +38,7 @@
     @yield('body')
 
     @livewireScripts
+    <script src="https://cdn.jsdelivr.net/gh/livewire/[email protected]/dist/livewire-turbolinks.js" data-turbolinks-eval="false"></script>
 </body>
 
 </html>
diff --git a/src/stubs/default/tailwind.config.js b/src/stubs/default/tailwind.config.js
@@ -3,19 +3,13 @@ const defaultTheme = require('tailwindcss/defaultTheme');
 
 module.exports = {
     theme: {
-        container: {
-            center: true,
-        },
-
         extend: {
             fontFamily: {
                 sans: ['Inter var', ...defaultTheme.fontFamily.sans],
             },
         },
     },
 
-    darkMode: false, // or 'media' or 'class'
-
     variants: {},
 
     purge: {

diff --git a/src/stubs/default/webpack.mix.js b/src/stubs/default/webpack.mix.js
@@ -11,15 +11,14 @@ const mix = require("laravel-mix");
  |
  */
 
-mix.js("resources/js/app.js", "public/js")
+mix.js('resources/js/app.js', 'public/js')
     .js('resources/js/turbolinks.js', 'public/js')
-    .sass("resources/sass/app.scss", "public/css")
-    .options({
-        processCssUrls: false,
-        postCss: [require('tailwindcss')],
-    })
-    .sourceMaps();
+    .postCss('resources/css/app.css', 'public/css', [
+        require('postcss-import'),
+        require('tailwindcss'),
+        require('autoprefixer'),
+    ]).sourceMaps();
 
 if (mix.inProduction()) {
     mix.version();
-}
+}