Телеграмм чат группы webpack_ru страница 1774

parrot.ru

Рейтинг популярных групп и каналов

В рейтинге участвует:

групп:

каналов:

Виртуальный сервер на SSD - недорого!

Аренда выделенных и виртуальных серверов (VDS/VPS), хостинг, аренда IP-адресов, администрирование, круглосуточная поддержка

qwarta.ru подробнее

Резервное копирование с проверкой на вирусы!!!

Удобный сервис создания резервных копий на любой сервер сети интернет. Отслеживайте изменения, проверяйте на вирусы. Надежно защитите свой бизнес!

go.backupland.com

Выбираете сервер? Любая конфигурация на заказ!

Аренда физических серверов любых конфигураций под любые запросы - 1С бухгалтерия, игровые сервера, нагруженные проекты, интернет-магазины!

qwarta.ru подробнее

Size: a a a

Webpack — русскоговорящее сообщество

1318 membersпожаловаться на группу

2019 July 23

FB

Furrya Black in Webpack — русскоговорящее сообщество

Сергей Видинеев

Всем привет! Подскажите в вебпаке реально настроить file-loader или url-loader, чтобы картинки подключенные в scss(css) файлах, имели пути от текущей директории где находится scss файл. Например есть parent.scss и есть child.scss который назодится во вложенной папке относительно parent.scss, и рядом с child.scss лежит файл background.svg. Нужно чтобы путь подключаемого изображения был таким: url(background.svg)

можно использовать алиасы

resolve: {
  alias: {
      "@assets": `${ROOT_PATH}/app/assets`, // как пример
    },
},

тогда в scss что то вроде

url("~@assets/path/to/background.svg")

источник

07:36пожаловаться

СВ

Сергей Видинеев in Webpack — русскоговорящее сообщество

у меня около 200 файлов

источник

07:37пожаловаться

СВ

Сергей Видинеев in Webpack — русскоговорящее сообщество

вручную переписывать не хочется все пути

источник

07:37пожаловаться

FB

Furrya Black in Webpack — русскоговорящее сообщество

Сергей Видинеев

есть большие изображения, это я к примеру написал svg

url loader-у в опциях можно указать лимит, до которого файл обработается урл лоадером, после - файл лоадером

источник

07:37пожаловаться

СВ

Сергей Видинеев in Webpack — русскоговорящее сообщество

url loader-у в опциях можно указать лимит, до которого файл обработается урл лоадером, после - файл лоадером

ну это не решение проблемы

источник

07:38пожаловаться

СВ

Сергей Видинеев in Webpack — русскоговорящее сообщество

что если динамически генерировать множество алиасов?

источник

07:38пожаловаться

FB

Furrya Black in Webpack — русскоговорящее сообщество

Сергей Видинеев

вручную переписывать не хочется все пути

может стоит подумать чтобы привести пути к единому виду
вместо того чтобы "шаманить" с лоадерами
то есть что проще
динамически генерировать можно, только на основе чего?

источник

07:40пожаловаться

FB

Furrya Black in Webpack — русскоговорящее сообщество

если только вручную не описать все пути, но это +- та же работа что и завернуть все в один алиас, вроде
```

resolve: {
  alias: {
      "@assets": `${ROOT_PATH}/app/assets`, // как пример
    },
},

```

источник

07:41пожаловаться

FB

Furrya Black in Webpack — русскоговорящее сообщество

Сергей Видинеев

вручную переписывать не хочется все пути

тут больше к ide вопрос, имеет она тулзы для рефакторинга или нет
если есть ctrl + shift + R то лучше "в полуручную переписать все пути") ну лично мне так кажется, вам виднее
PS: пока файлов всего 200

источник

07:44пожаловаться

FB

Furrya Black in Webpack — русскоговорящее сообщество

Приветы, может кто то может подсказать.

*) .scss с примерно таким кодом:

$rootSelector: "ui-icon";

.#{$rootSelector} {
  padding: var(--#{$rootSelector}--padding)
}

*) css-loader с { modules: true }
то есть будет что то вроде

.ui-icon-%smth_hash%

не могу сообразить, как обработать variables, чтобы вместо

--ui-icon--padding

было

--%smth_hash%--padding

То есть хочеца получить сгенерированный уникальный селектор внути .scss файла ака переменную,
чтобы делать что то вроде:

padding: var(--#{:root}--padding)

Ни у кого нет идей?
Если не понятно, скажите, я постараюсь описать подробней.
Сорян за назойливость.

источник

07:46пожаловаться

A

Alex CherryTea in Webpack — русскоговорящее сообщество

Ни у кого нет идей?
Если не понятно, скажите, я постараюсь описать подробней.
Сорян за назойливость.

Дичь какая-то

источник

08:00пожаловаться

A

Alex CherryTea in Webpack — русскоговорящее сообщество

Ни у кого нет идей?
Если не понятно, скажите, я постараюсь описать подробней.
Сорян за назойливость.

А вы не пытаетесь переизобрести колесо? Вам точно родного ограничения облоасти видимости ксс переменных не хватает? И надо ли вам это делать в рантайме, может ваша задача для пост ксс?

источник

08:04пожаловаться

DK

Denis Kolosov in Webpack — русскоговорящее сообщество

Сергей Видинеев

Всем привет! Подскажите в вебпаке реально настроить file-loader или url-loader, чтобы картинки подключенные в scss(css) файлах, имели пути от текущей директории где находится scss файл. Например есть parent.scss и есть child.scss который назодится во вложенной папке относительно parent.scss, и рядом с child.scss лежит файл background.svg. Нужно чтобы путь подключаемого изображения был таким: url(background.svg)

для scss есть resolve-url-loader

источник

08:22пожаловаться

ВТ

Виталий Торопов in Webpack — русскоговорящее сообщество

парни, кто-нибудь знает как настроить HMR и на css и на html, или хотя бы на html просто liveReload при изменении DOM, сколько не гуглил, решения не подходили, по крайней мере, мне не удалось их настроить под свою сборку, может кто в курсе или знает пару линков, в какую сторону мне копать?

источник

08:27пожаловаться

A

Abilmansur in Webpack — русскоговорящее сообщество

ребят, помогите заимпортить antd css в вебпак? ранее не работал с вебпаком

источник

08:50пожаловаться

.

. in Webpack — русскоговорящее сообщество

ребят, помогите заимпортить antd css в вебпак? ранее не работал с вебпаком

Он сам подтягивается, если импортишь его в компонент

источник

10:13пожаловаться

A

Abilmansur in Webpack — русскоговорящее сообщество

Он сам подтягивается, если импортишь его в компонент

у меня стоит babel-loader. а в документации ант говорится что если babel то надо прописать в plugins ["import", { "libraryName": "antd", "libraryDirectory": "es", "style": "css" }]

источник

10:13пожаловаться

EP

Evgeniy Podivilov in Webpack — русскоговорящее сообщество

у меня стоит babel-loader. а в документации ант говорится что если babel то надо прописать в plugins ["import", { "libraryName": "antd", "libraryDirectory": "es", "style": "css" }]

Это настройка плагина babel-plugin-import для лучшего тришейкинга

источник

11:48пожаловаться

EP

Evgeniy Podivilov in Webpack — русскоговорящее сообщество

Для самих стилей должен быть соответствующий css лоадер

источник

11:50пожаловаться

G

Glebcha in Webpack — русскоговорящее сообщество

можете подсказать альтернативу https://github.com/prateekbh/babel-esm-plugin с удалением внешних зависимостей из бандла?

prateekbh/babel-esm-plugin

Add this plugin to generate mirrored esm modules for your existing bundles - prateekbh/babel-esm-plugin

источник

12:50пожаловаться