сова уже наверное сделал

да чет найти нема

🤔

как так

бабель "сложный" чтобы его в целую конфу выносить
нужно бить на плугины и присеты

Сделать чаты по отдельным плагинам 🧐🧐🧐

Чат по автопрефиксеру

Гайс, как замутить такое (это будет оверсложно даже объяснить), дальше будет контекст и задача:
Есть проект на реакте + css modules (scss). Это чат-виджет для сторонних сайтов. Проект сам создает iframe и все приложение рендериться в нем, в общем вся жизнь внутри iframe, все стили изолированны внутри iframe (за исключением парочки для iframe, что вставляются в сторонний сайт). У iframe есть 2 состояние: кнопка вызова чата И открытый чат без кнопки.

Существует темизация (Color theming назовем) реализованая с помощью css variables, и это история про цвета каких-то блоков внутри iframe. Условно, подтягивается конфиг с сервера, а потом формируеются список css variable внутри iframe и каждой переменной присваивается значение из конфига. Все это отлично работает.

Но теперь темизацию надо расширить (Extended theming назовем). Теперь темизация касается уже размеров шрифтов, отступов и тд. Тут все тот же принцип - css variables, но есть два момента:

1. В Extended theming будут входить размеры iframe для одного из стейта и css variables тут не помощник, но об этом пункте чуть позже
2. Этих тем может быть сколько угодно, они будут добавляться, по-этому эту часть темизация я хотел бы выносить в отдельные css bundle, который бы включал css modules.

Что касается размеров iframe - то размеры его в темизации не могут быть в css variables, потому что css variables это история про то что внутри, а не снаружи. Но надо все это как-то помещать в один бандл, который будет подтягиваться в зависимости от то, что за тема (название) будет указано в конфиге. Render flow у iframe сложный, но если коротко то вот:

1. Приложение фетчит конфиг
2. Происходит первичный рендер iframe с очень простым html шаблоном внутри, и рендериться он с opacity: 0
3. Внутри iframe ожидается загруказ css бандла (общего)
4. После загрузки css файла срабатывает событие о том, что css вставлен в cssom
5. Приложение запускает таймер 1000мс (за это время браузер должен перерендерить весь cssom
6. После таймера, когда мы (типа) уверены, что все nodes выглядят так как и должны в связки с cssom, проиходят всякие вычисление типа .getBoundingClientRect()
7. После назначаются стили для самого iframe (ну типа мы узнали размер кнопки открытия чата с помощью .getBoundingClientRect() и теперь iframe в этом стейте должен быть такого же размера как кнопка)
8. Присвоение css variables из конфига внутри iframe


Как я вижу решение: scss с темой должен содержать свои css variables, в том числе и для значения для iframe, но они будут тупо парситься с помощью js после вставки в cssom и потом встрайваться в выше описанный флоу (пункт 7), ну а стили буду как обычно работать.
Но как сделать это отдельными бандлами и чтобы учитывался css modules (речь о том, что классы будут переименованы после сборки).

Вопрос для инженеров =)

А какой командой запускаешь webpack?

хммм

Я кажется понял свою ошибку))

Помогите разобраться, где хранится спрайт (файл)? https://github.com/swisnl/vue-cli-plugin-svg-sprite

плагин построен на основе этого https://github.com/kisenka/svg-sprite-loader#extract-configuration

в корне папка img не появилась

ну неужели никто не может тут подсказать?

С Вью не работал, но может надо искать не в корне, а в output папке?

Что за папка?