Symfony: Webpack Encore — плагин для управления ресурсами

[@MetaDone]

Полезная фишка, судя по всему вдохновленная Laravel Mix/Laraver Elixir

[@franzose]

Так и есть, в документации указано влияние)

[@Quber]

Большое спасибо. Очень интересный материал

[@borNfree]

Стоит отметить, что релизнута была поддержка TypeScript, что делает этот интсрумент еще более интересным.

[@shude]

Про Webpack в целом можно много написать. Данный пост относится именно к плагину для Symfony — Webpack Encore. Насколько я знаю TypeScript уже давно прикрутили.

[@borNfree]

я именно про Encore и говорю, поддержка TypeScript была вмержена 5 дней назад

[@shude]

Точно. Как-то я пропустил. Спасибо, добавлю в пост информацию.

[@s0lar]

Не смог найти bootstrap 4 sass версию в списке пакетов. Поэтому скачивали самостоятельно их?
Вообще странно, что скомпилленую версию можно установить через yarn/npm, а sass нет!

[@pudovMaxim]

Есть.
npm install bootstrap
Исходники будут ждать в /node_modules/bootstrap/scss

[@shude]

А по поводу скачанного бутстрапа, это специально было сделано для демонстрации того, что работать можно абсолютно с любыми ресурсами. Скачали вы их самостоятельно или установили через менеджер — не важно. Так же не обязательно подключать исходники, можно пользоваться скомпилированными версиями. Все зависит от задачи.

[@s0lar]

Спасибо, с бутстрапом разобрался. Но вот можете еще пояснить один момент?!
Как быть с картинками?
Если я в scss указываю background: url("./assets/svg/logo.png") no-repeat;
то получаю ошибку в консоль
ERROR Failed to compile with 1 errors 19:10:41

This relative module was not found:

* ./assets/svg/logo.png in ./node_modules/css-loader??ref--4-2!./node_modules/sass-loader/lib/loader.js??ref--4-3!./assets/sass/main.scss

Я с Webpack'ом совсем не знаком, можно пример как работать с файлами jpg/png/svg?
Для них нужен отдельный loader?
Хранить эти файлы тоже нужно в ./assets/?

Все зависимости (шрифты, картинки) скопированы в соответствующие места.

Звучит все очень просто, но не смог найти в сети примера!

[@shude]

В вашем случае, изображение logo.png, должно лежать в assets/svg/logo.png
При этом файл main.scss должен быть размещен рядом с папкой assets.
Папка assets недоступна из web. В дальнейшем, при копировании в web папку, изображение будет перенесено, а путь в scss файле заменен на новый.

[@s0lar]

Вы правы! Я просто напутал с путями. Пятница, пора отдыхать :)
Спасибо!