Для установки Semantic UI в Laravel 9, вам понадобится выполнить несколько шагов.
Шаг 1: Установка Laravel 9
Первым делом нужно установить Laravel 9, если у вас еще не установлено. Для этого можно использовать Composer, который является пакетным менеджером PHP. Если у вас уже установлен Composer, выполните следующую команду в командной строке:
composer global require laravel/installer
После установки Laravel 9, можно создать новый проект с помощью следующей команды:
laravel new project-name
Шаг 2: Установка Semantic UI
После установки Laravel 9, перейдите в папку вашего проекта и выполните команду для установки Semantic UI:
npm install semantic-ui-sass --save
Команда npm install установит пакет semantic-ui-sass, который содержит все компоненты Semantic UI, а флаг --save добавит его в список зависимостей вашего проекта.
Шаг 3: Создание пользовательского файла стилей
После установки Semantic UI, необходимо создать пользовательский файл стилей *в вашем проекте*. Для этого выберите путь, где будет храниться файл стилей, и создайте его внутри папки resources/sass вашего проекта Laravel.
Предположим, вы создали файл app.scss. Откройте его и импортируйте Semantic UI, добавив следующую строку в начале файла:
@import 'semantic-ui';
Шаг 4: Компиляция пользовательских стилей
При компиляции Sass-файлы автоматически скомпилируются в CSS. Для этого выполните следующую команду:
npm run dev
Команда npm run dev скомпилирует ваши пользовательские файлы CSS.
Шаг 5: Пользовательские стили в шаблоне
Наконец, остается только подключить скомпилированный файл CSS в вашем шаблоне. Откройте файл resources/views/layouts/app.blade.php и добавьте следующий код внутри тега <head>:
<link rel="stylesheet" href="{{ asset('css/app.css') }}">
После этого вы сможете использовать Semantic UI в вашем Laravel 9 проекте.
Вот и всё! Теперь вы установили Semantic UI в Laravel 9 и готовы начать использовать его компоненты в вашем проекте.