Repository

jeroennoten/Laravel-AdminLTE

Easy AdminLTE integration with Laravel
jeroennoten
3480 990 129 763
kungro
Issue Asked: December 26, 2022, 5:03 pm In:

[FEATURE] Add support to LARAVEL VITE

Now in Laravel 9 vite is the default asset builder:

https://laravel.com/docs/9.x/vite

Can you please add support to vite in this library?

2 Comments

  1. Hi @kungro , you have the possibility of publishing the package views to add such a customization. If you manage to implement the support, not conflicting with other previous feature, then you may create a pull request to include it on this package. Or you can share the changes you have done here so we can check what's need to be done on the package. I will be pleased of doing this in the future, but I'm currently out of time...

  2. @kungro Usually, when I use this package I create a base layout for the entire web application (in resources/views/layouts/app.blade.php). So, to use vite I think you may create a base layout pushing the vite blade directive into the css section provided by this package, as shown on the next example:

    {{-- Extends the AdminLTE page layout  --}}

@extends('adminlte::page')

{{-- Browser Title --}}

@section('title')
    {{ config('adminlte.title') }}
    @hasSection('subtitle') | @yield('subtitle') @endif
@stop

{{-- Page Content Header --}}

@section('content_header')
    @hasSection('content_header_title')
        <h1 class="text-muted">
            @yield('content_header_title')

            @hasSection('content_header_subtitle')
                <small class="text-lightblue">
                    <i class="fas fa-xs fa-angle-right text-muted"></i>
                    @yield('content_header_subtitle')
                </small>
            @endif
        </h1>
    @endif
@stop

{{-- Page Content Body --}}

@section('content')
    @yield('content_body')
@stop

{{-- Page Footer --}}

@section('footer')
    <div class="float-right d-none d-sm-block">
        {{-- Version number here --}}
    </div>

    <strong>
       {{-- Company name here --}}
    </strong>
@stop

{{-- Extra common CSS --}}

@push('css')
    @vite(['resources/css/app.css', 'resources/js/app.js'])
@endpush

    Then, all your views should extend from this layout and use the sections provided by this new layout, example:

    @extends('layouts.app')

{{-- Include plugins --}}

@section('plugins.OnePluginForThisView', true)
@section('plugins.AnotherPluginForThisView', true)

{{-- Customize layout sections --}}

@section('subtitle', "The browser's subtitle")
@section('content_header_title', "The view title")
@section('content_header_subtitle', "The view subtitle")

{{-- Content body: main page content --}}

@section('content_body')
    {{-- The main markup of the view here --}}
@stop

    I hope this helps you!

Repository Languages
Repository Topics