Этот пакет 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.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
