Управление CSS и JavaScript
Дата обновления перевода: 2021-06-01
Управление CSS и JavaScript
Screencast
Предпочитаете видео-уроки? Посмотрите Webpack Encore screencast series.
Symfony поставляется с библиотекой полностью на JavaScript - называемой Webpack Encore
- которая делает работу с CSS и JavaScript радостью. Вы можете использовать ее, или
что-то другое, или просто создавать статичные файлы CSS и JS files в вашем каталоге public/
и включать их в ваши шаблоны.
Webpack Encore
Webpack Encore - это упрощенный сопсоб интеграции Webpack в ваше приложение. Он становится оберткой для Webpack, предоставляя вам чистый и мощный API для построения модулей JavaScript, предварительной обработки CSS и JS, а также для компиляции и уменьшения ресурсов. Encore предоставляет вам профессиональную систему ресурсов, упоительную в использовании.
Enconre вдохновлена Webpacker и Mix, но создана в духе Webpack: использует его функции, концепты и договорености по именованию для более привычного ощущения. Она стремится исправить большинство распросраненных случаев использования Webpack.
Tip
Encore сделана Symfony и прекрасно работает в приложениях Symfony. Но она также с легкостью может быть использована в любом приложении... На любом языке!
Документация Encore
Справочники
- Использоваие самозагрузки CSS & JS
- Создание CSS/JS для конкретных страниц
- jQuery и приложения наследования
- Передача информации из Twig в JavaScript
- webpack-dev-server и Hot Module Replacement (HMR)
- Добавление пользовательских загрузчиков и плагинов
- Продвинутая конфигурация Advanced
- Использование Encore в Виртуальной Машине
Другие статьи о фронтенде
- Assetic
- Assetic
- Как использовать стратегию пользовательских версий для ресурсов
- Продвинутая конфигурация Webpack
- Конфигурирование Babel
- Использование Bootstrap CSS и JS
- Использование CDN
- Асихнронное разделение кода
- Копирование и ссылание на изображения
- Предпроцессоры CSS: Sass, LESS, Stylus, и др.
- CSS-предпроцессоры: Sass, LESS, и др.
- Добавление пользовательских загрузчиков и плагинов
- Using webpack-dev-server and HMR
- Мспользование webpack-dev-server и HMR
- ЧЗВ и распространенные проблемы
- Установка Encore
- jQuery и приложения наследования
- Создание CSS/JS, присущих странице
- PostCSS и автоматическое добавление префиксов (postcss-loader)
- Подключение React.js
- Передача информации из Twig в JavaScript
- Создание общей распространённой записи
- Encore: Настройка вашего проекта
- Включение исходных карт
- Предотвращение дублирования путем "разделения" общего кода в отдельные файлы
- Подключение TypeScript (ts-loader)
- Встраивание изображений и шрифтов в CSS
- Версионирование ресурсов
- Encore против Assetic?
- Using Encore in a Virtual Machine
- Подключение Vue.js (vue-loader)
- Инициатипа и пакеты Symfony UX