feat: vite support with components

InfyOmLabs · Mar 18, 2023 · 0a30eb3 · 0a30eb3
1 parent d1bd989
commit 0a30eb3
Show file tree

Hide file tree

Showing 19 changed files with 84 additions and 307 deletions.
diff --git a/adminlte-stubs/auth-localized/login.blade.php b/adminlte-stubs/auth-localized/login.blade.php
@@ -1,21 +1,4 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <title>{{ config('app.name') }}</title>
-
-    <!-- Tell the browser to be responsive to screen width -->
-    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
-
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/all.min.css"
-          integrity="sha512-1PKOgIY59xJ8Co8+NE6FZ+LOAZKjy+KY8iq0G4B3CyeY6wYHN3yt9PW0XpSriVlkMXe40PTKnXrLnZ9+fkDaog=="
-          crossorigin="anonymous"/>
-
-    <link href="{{ mix('css/app.css') }}" rel="stylesheet">
-
-</head>
-<body class="hold-transition login-page">
+<x-laravel-ui-adminlte::adminlte-layout>
 <div class="login-box">
     <div class="login-logo">
         <a href="{{ url('/home') }}"><b>{{ config('app.name') }}</b></a>
@@ -87,8 +70,4 @@ class="form-control @error('password') is-invalid @enderror">
 
 </div>
 <!-- /.login-box -->
-
-<script src="{{ mix('js/app.js') }}"></script>
-
-</body>
-</html>
+</x-laravel-ui-adminlte::adminlte-layout>
diff --git a/adminlte-stubs/auth-localized/passwords/confirm.blade.php b/adminlte-stubs/auth-localized/passwords/confirm.blade.php
@@ -1,21 +1,4 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <title>{{ config('app.name') }}</title>
-
-    <!-- Tell the browser to be responsive to screen width -->
-    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
-
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/all.min.css"
-          integrity="sha512-1PKOgIY59xJ8Co8+NE6FZ+LOAZKjy+KY8iq0G4B3CyeY6wYHN3yt9PW0XpSriVlkMXe40PTKnXrLnZ9+fkDaog=="
-          crossorigin="anonymous"/>
-
-    <link href="{{ mix('css/app.css') }}" rel="stylesheet">
-
-</head>
-<body class="hold-transition login-page">
+<x-laravel-ui-adminlte::adminlte-layout>
 <div class="login-box">
     <div class="login-logo">
         <a href="{{ url('/home') }}"><b>{{ config('app.name') }}</b></a>
@@ -60,7 +43,4 @@ class="form-control{{ $errors->has('password') ? ' is-invalid' : '' }}"
 
 </div>
 
-<script src="{{ mix('js/app.js') }}"></script>
-
-</body>
-</html>
+</x-laravel-ui-adminlte::adminlte-layout>
diff --git a/adminlte-stubs/auth-localized/passwords/email.blade.php b/adminlte-stubs/auth-localized/passwords/email.blade.php
@@ -1,21 +1,4 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <title>{{ config('app.name') }}</title>
-
-    <!-- Tell the browser to be responsive to screen width -->
-    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
-
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/all.min.css"
-          integrity="sha512-1PKOgIY59xJ8Co8+NE6FZ+LOAZKjy+KY8iq0G4B3CyeY6wYHN3yt9PW0XpSriVlkMXe40PTKnXrLnZ9+fkDaog=="
-          crossorigin="anonymous"/>
-
-    <link href="{{ mix('css/app.css') }}" rel="stylesheet">
-
-</head>
-<body class="hold-transition login-page">
+<x-laravel-ui-adminlte::adminlte-layout>
 <div class="login-box">
     <div class="login-logo">
         <a href="{{ url('/home') }}"><b>{{ config('app.name') }}</b></a>
@@ -67,8 +50,4 @@ class="form-control{{ $errors->has('email') ? ' is-invalid' : '' }}"
     </div>
 </div>
 <!-- /.login-box -->
-
-<script src="{{ mix('js/app.js') }}"></script>
-
-</body>
-</html>
+</x-laravel-ui-adminlte::adminlte-layout>
diff --git a/adminlte-stubs/auth-localized/passwords/reset.blade.php b/adminlte-stubs/auth-localized/passwords/reset.blade.php
@@ -1,21 +1,4 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <title>{{ config('app.name') }}</title>
-
-    <!-- Tell the browser to be responsive to screen width -->
-    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
-
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/all.min.css"
-          integrity="sha512-1PKOgIY59xJ8Co8+NE6FZ+LOAZKjy+KY8iq0G4B3CyeY6wYHN3yt9PW0XpSriVlkMXe40PTKnXrLnZ9+fkDaog=="
-          crossorigin="anonymous"/>
-
-    <link href="{{ mix('css/app.css') }}" rel="stylesheet">
-
-</head>
-<body class="hold-transition login-page">
+<x-laravel-ui-adminlte::adminlte-layout>
 <div class="login-box">
     <div class="login-logo">
         <a href="{{ url('/home') }}"><b>{{ config('app.name') }}</b></a>
@@ -87,8 +70,4 @@ class="form-control"
     </div>
 
 </div>
-
-<script src="{{ mix('js/app.js') }}"></script>
-
-</body>
-</html>
+</x-laravel-ui-adminlte::adminlte-layout>
diff --git a/adminlte-stubs/auth-localized/register.blade.php b/adminlte-stubs/auth-localized/register.blade.php
@@ -1,21 +1,4 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <title>{{ config('app.name') }} | Registration Page</title>
-
-    <!-- Tell the browser to be responsive to screen width -->
-    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
-
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/all.min.css"
-          integrity="sha512-1PKOgIY59xJ8Co8+NE6FZ+LOAZKjy+KY8iq0G4B3CyeY6wYHN3yt9PW0XpSriVlkMXe40PTKnXrLnZ9+fkDaog=="
-          crossorigin="anonymous"/>
-
-    <link href="{{ mix('css/app.css') }}" rel="stylesheet">
-
-</head>
-<body class="hold-transition register-page">
+<x-laravel-ui-adminlte::adminlte-layout>
 <div class="register-box">
     <div class="register-logo">
         <a href="{{ url('/home') }}"><b>{{ config('app.name') }}</b></a>
@@ -110,8 +93,4 @@ class="form-control"
     <!-- /.form-box -->
 </div>
 <!-- /.register-box -->
-
-<script src="{{ mix('js/app.js') }}"></script>
-
-</body>
-</html>
+</x-laravel-ui-adminlte::adminlte-layout>
diff --git a/adminlte-stubs/auth/login.blade.php b/adminlte-stubs/auth/login.blade.php
@@ -1,21 +1,4 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <title>{{ config('app.name') }}</title>
-
-    <!-- Tell the browser to be responsive to screen width -->
-    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
-
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/all.min.css"
-          integrity="sha512-1PKOgIY59xJ8Co8+NE6FZ+LOAZKjy+KY8iq0G4B3CyeY6wYHN3yt9PW0XpSriVlkMXe40PTKnXrLnZ9+fkDaog=="
-          crossorigin="anonymous"/>
-
-    <link href="{{ mix('css/app.css') }}" rel="stylesheet">
-
-</head>
-<body class="hold-transition login-page">
+<x-laravel-ui-adminlte::adminlte-layout>
 <div class="login-box">
     <div class="login-logo">
         <a href="{{ url('/home') }}"><b>{{ config('app.name') }}</b></a>
@@ -87,8 +70,4 @@ class="form-control @error('password') is-invalid @enderror">
 
 </div>
 <!-- /.login-box -->
-
-<script src="{{ mix('js/app.js') }}"></script>
-
-</body>
-</html>
+</x-laravel-ui-adminlte::adminlte-layout>
diff --git a/adminlte-stubs/auth/passwords/confirm.blade.php b/adminlte-stubs/auth/passwords/confirm.blade.php
@@ -1,21 +1,4 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <title>{{ config('app.name') }}</title>
-
-    <!-- Tell the browser to be responsive to screen width -->
-    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
-
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/all.min.css"
-          integrity="sha512-1PKOgIY59xJ8Co8+NE6FZ+LOAZKjy+KY8iq0G4B3CyeY6wYHN3yt9PW0XpSriVlkMXe40PTKnXrLnZ9+fkDaog=="
-          crossorigin="anonymous"/>
-
-    <link href="{{ mix('css/app.css') }}" rel="stylesheet">
-
-</head>
-<body class="hold-transition login-page">
+<x-laravel-ui-adminlte::adminlte-layout>
 <div class="login-box">
     <div class="login-logo">
         <a href="{{ url('/home') }}"><b>{{ config('app.name') }}</b></a>
@@ -59,8 +42,4 @@ class="form-control{{ $errors->has('password') ? ' is-invalid' : '' }}"
     </div>
 
 </div>
-
-<script src="{{ mix('js/app.js') }}" defer></script>
-
-</body>
-</html>
+</x-laravel-ui-adminlte::adminlte-layout>
diff --git a/adminlte-stubs/auth/passwords/email.blade.php b/adminlte-stubs/auth/passwords/email.blade.php
@@ -1,21 +1,4 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <title>{{ config('app.name') }}</title>
-
-    <!-- Tell the browser to be responsive to screen width -->
-    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
-
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/all.min.css"
-          integrity="sha512-1PKOgIY59xJ8Co8+NE6FZ+LOAZKjy+KY8iq0G4B3CyeY6wYHN3yt9PW0XpSriVlkMXe40PTKnXrLnZ9+fkDaog=="
-          crossorigin="anonymous"/>
-
-    <link href="{{ mix('css/app.css') }}" rel="stylesheet">
-
-</head>
-<body class="hold-transition login-page">
+<x-laravel-ui-adminlte::adminlte-layout>
 <div class="login-box">
     <div class="login-logo">
         <a href="{{ url('/home') }}"><b>{{ config('app.name') }}</b></a>
@@ -67,8 +50,4 @@ class="form-control{{ $errors->has('email') ? ' is-invalid' : '' }}"
     </div>
 </div>
 <!-- /.login-box -->
-
-<script src="{{ mix('js/app.js') }}" defer></script>
-
-</body>
-</html>
+</x-laravel-ui-adminlte::adminlte-layout>
diff --git a/adminlte-stubs/auth/passwords/reset.blade.php b/adminlte-stubs/auth/passwords/reset.blade.php
@@ -1,21 +1,4 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <title>{{ config('app.name') }}</title>
-
-    <!-- Tell the browser to be responsive to screen width -->
-    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
-
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/all.min.css"
-          integrity="sha512-1PKOgIY59xJ8Co8+NE6FZ+LOAZKjy+KY8iq0G4B3CyeY6wYHN3yt9PW0XpSriVlkMXe40PTKnXrLnZ9+fkDaog=="
-          crossorigin="anonymous"/>
-
-    <link href="{{ mix('css/app.css') }}" rel="stylesheet">
-
-</head>
-<body class="hold-transition login-page">
+<x-laravel-ui-adminlte::adminlte-layout>
 <div class="login-box">
     <div class="login-logo">
         <a href="{{ url('/home') }}"><b>{{ config('app.name') }}</b></a>
@@ -91,8 +74,4 @@ class="form-control"
     </div>
 
 </div>
-
-<script src="{{ mix('js/app.js') }}" defer></script>
-
-</body>
-</html>
+</x-laravel-ui-adminlte::adminlte-layout>
diff --git a/adminlte-stubs/auth/register.blade.php b/adminlte-stubs/auth/register.blade.php
@@ -1,21 +1,4 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <title>{{ config('app.name') }} | Registration Page</title>
-
-    <!-- Tell the browser to be responsive to screen width -->
-    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
-
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/all.min.css"
-          integrity="sha512-1PKOgIY59xJ8Co8+NE6FZ+LOAZKjy+KY8iq0G4B3CyeY6wYHN3yt9PW0XpSriVlkMXe40PTKnXrLnZ9+fkDaog=="
-          crossorigin="anonymous"/>
-
-    <link href="{{ mix('css/app.css') }}" rel="stylesheet">
-
-</head>
-<body class="hold-transition register-page">
+<x-laravel-ui-adminlte::adminlte-layout>
 <div class="register-box">
     <div class="register-logo">
         <a href="{{ url('/home') }}"><b>{{ config('app.name') }}</b></a>
@@ -110,8 +93,4 @@ class="form-control"
     <!-- /.form-box -->
 </div>
 <!-- /.register-box -->
-
-<script src="{{ mix('js/app.js') }}" defer></script>
-
-</body>
-</html>
+</x-laravel-ui-adminlte::adminlte-layout>
diff --git a/adminlte-stubs/bootstrap/bootstrap.js b/adminlte-stubs/bootstrap/bootstrap.js
@@ -1,4 +1,4 @@
-window._ = require('lodash');
+// window._ = require('lodash');
 
 /**
  * We'll load jQuery and the Bootstrap jQuery plugin which provides support

diff --git a/adminlte-stubs/bootstrap/vite.config.js b/adminlte-stubs/bootstrap/vite.config.js
@@ -0,0 +1,20 @@
+import { defineConfig } from 'vite';
+import laravel from 'laravel-vite-plugin';
+
+export default defineConfig({
+    plugins: [
+        laravel({
+            input: ['resources/sass/app.scss', 'resources/js/app.js'],
+            refresh: true,
+        }),
+    ],
+    resolve: {
+        alias: [
+            {
+                // this is required for the SCSS modules
+                find: /^~(.*)$/,
+                replacement: '$1',
+            },
+        ],
+    },
+});
diff --git a/adminlte-stubs/bootstrap/webpack.mix.js b/adminlte-stubs/bootstrap/webpack.mix.js