belakasdata / laravel-admin-lte
Laravel 包,用于集成 AdminLTE 模板,并且与 Laravel Mix 兼容。
Requires
- php: >=5.6.4
- laravel/framework: ^5.4
Requires (Dev)
- fzaninotto/faker: ~1.4
- laravel/tinker: ~1.0
- mockery/mockery: 0.9.*
- phpunit/phpunit: ~5.7
This package is auto-updated.
Last update: 2024-09-14 17:26:43 UTC
README
Laravel 包,用于集成 AdminLTE 模板,并且与 Laravel Mix 兼容。目前,此包只能在全新安装上轻松集成。
对于印度尼西亚语(🇮🇩)翻译,请 点击此链接
安装
composer require atnic/laravel-admin-lte
如果你使用的是 Laravel 5.5 及以上版本,则可以跳过此步骤,否则在 config/app.php
的 providers
下添加此行:
'providers' => [ ... Atnic\AdminLTE\Providers\AppServiceProvider::class, ... ]
然后运行:
php artisan make:admin-lte
让我们看看我们安装了什么。首先,确保你已经运行了 php artisan migrate
命令,然后执行以下操作:
php artisan serve
哇!你现在正在运行一个使用 AdminLTE 的 Laravel 网站。
有关命令的更多信息,请参考
php artisan make:admin-lte --help
用法
此包提供了 auth 和 app 的视图。查看 resources/views/layouts/app.blade.php
。
在这个文件中,你可以扩展全局部分,如用户名、头像、面包屑和菜单。
要扩展菜单,请在 app.blade.php
中添加以下内容:
@section('sidebar-menu') <ul class="sidebar-menu"> <li class="header">MAIN NAVIGATOR</li> <li class="active"> <a href="{{ route('home') }}"> <i class="fa fa-home"></i> <span>Home</span> </a> </li> </ul> @endsection
要扩展面包屑,请添加以下内容:
@section('breadcrumbs') <ol class="breadcrumb"> <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li> <li class="active">Title</li> </ol> @endsection
此包允许您自由选择使用任何 Laravel 包来处理菜单和面包屑。我们推荐 spatie/laravel-menu 或 lavary/laravel-menu,以及 davejamesmiller/laravel-breadcrumbs。
任何新创建的页面都应该扩展此视图。
@extends('layouts.app') // Your blade here
配置和视图定制
配置
要发布此包配置到您的应用程序配置中,请运行:
php artisan vendor:publish --provider="Atnic\AdminLTE\Providers\AppServiceProvider" --tag="config"
视图
要发布此包视图以便您可以自定义,请运行:
php artisan vendor:publish --provider="Atnic\AdminLTE\Providers\AppServiceProvider" --tag="views"
下一步
首先,您应该了解如何使用 Laravel Mix。
确保 package.json
包含 "laravel-mix": "^2.0"
。
AdminLTE 需要一些 npm 包。首先,你需要运行:
npm install
从 npm 安装 AdminLTE 需要的包
npm install --save-dev admin-lte@^2.4 bootstrap-sass fastclick font-awesome icheck ionicons jquery jquery-slimscroll
运行 Laravel Mix 命令:
npm run development
或者使用 production
最小化输出
npm run production
然后仔细查看这些文件:
webpack.mix.js
resources/assets/js/admin-lte.js
resources/assets/js/auth.js
resources/assets/sass/admin-lte.scss
resources/assets/sass/auth.scss
尽情实验!