Цей пакет Laravel Themer додає підтримку кількох тем до вашої програми Laravel. Він також надає простий каркас автентифікації та попередні налаштування для Bootstrap, Tailwind, Vue та React як відправну точку для створення програми Laravel.
На мій погляд, цей Laravel Пакет Themer є кращою альтернативою офіційному laravel/ui & Пакунки laravel/breeze через наступні функції:
- Any number of themes
- Fallback theme support (WordPress style); It allows creating a child theme to extend any theme
- Provides authentication scaffolding similar to
laravel/ui&laravel/breeze - Exports all auth controllers, tests, and other files similar to
laravel/breeze - Provides frontend presets for Bootstrap, Tailwind, Vue 2, Vue 3, and React
Якщо ви не хочете використовувати каркас автентифікації цього пакета, натомість вам потрібно використовувати Laravel Fortify, з цим немає проблем. Ви також можете використовувати Laravel Themer із Fortify.Laravel Fortify — це інтерфейс агностичної аутентифікації для Laravel, який не надає представлень або попередніх налаштувань інтерфейсу. Отже, використовуйте Fortify для серверної автентифікації та Laravel Themer для переглядів, попередніх налаштувань і підтримки кількох тем.
Відеоінструкція
Встановлення
Встановлення через композитор
composer require qirolab/laravel-themerОпублікуйте файл конфігурації:
php artisan vendor:publish --provider="Qirolab\Theme\ThemeServiceProvider" --tag="config"Створення теми
Скористайтеся такою командою, щоб створити тему:
php artisan make:theme
Проміжне програмне забезпечення для встановлення теми
Зареєструвати ThemeMiddleware< /code> у app\Http\Kernel.php:
protected $routeMiddleware = [
// ...
'theme' => \Qirolab\Theme\Middleware\ThemeMiddleware::class,
];Приклади використання проміжного ПЗ:
Методи теми:
Route::get('/dashboard', 'DashboardController@index')
->middleware('theme:dashboard-theme');webpack.mix.js Конфігурація
// Set active theme
Theme::set('theme-name');
// Get current active theme
Theme::active();
// Get current parent theme
Theme::parent();
// Clear theme. So, no theme will be active
Theme::clear();
// Get theme path
Theme::path($path = 'views');
// output:
// /app-root-path/themes/active-theme/views
Theme::path($path = 'views', $themeName = 'admin');
// output:
// /app-root-path/themes/admin/views
Theme::getViewPaths();
// Output:
// [
// '/app-root-path/themes/admin/views',
// '/app-root-path/resources/views'
// ]Після створення нової теми створюється окремий файл webpack.mix.js для цієї теми. Отже, щоб скомпілювати файл webpack.mix.js теми, його слід включити в webpack.mix.js програми, який розташований у кореневому шляху.
У випадку кількох тем, якщо ви додаєте кілька webpack.mix.js різних тем. Потім webpackможе не скомпілювати їх правильно. Отже, вам слід змінити кореневий webpack.mix.js за допомогою такого коду:
// add this in the root `webpack.mix.js`
require(`${__dirname}/themes/theme-name/webpack.mix.js`);Тепер ви можете використати таку команду для компіляції ресурси для певної теми:
let theme = process.env.npm_config_theme;
if(theme) {
require(`${__dirname}/themes/${theme}/webpack.mix.js`);
} else {
// default theme to compile if theme is not specified
require(`${__dirname}/themes/theme-name/webpack.mix.js`);
}npm run dev --theme=theme-name
