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

Обсуждения webpack, лоадеров, плагинов и сборок Правила: http://bit.ly/our_etiquette См. также: @rollup_ru, @react_js, @vscode_ru, @macos_ru, @js_ru

974 members

Архив канала @webpack_ru 21 марта 2018 г.

01:58:09 ДП
04:47:34 ДП
User 90721916
Привет, а как вы делаете динамические импорты типа  import(${path})? Нужен какой-то специфичный конфиг бандлов?
04:52:31 ДП
User 134905826
User 90721916
Привет, а как вы делаете динамические импорты типа  import(${path})? Нужен какой-то специфичный конфиг бандлов?
require
04:53:10 ДП
User 139059931
User 90721916
Привет, а как вы делаете динамические импорты типа  import(${path})? Нужен какой-то специфичный конфиг бандлов?
нет, просто берешь и делаешь!
05:02:05 ДП
User 90721916
Дима все равно сгенерируется  webpack_require, у меня он не находит модуль.
05:03:10 ДП
User 90721916
причем, import('one/two/three') находит, а импорт переменной с таким значением фиг
05:18:06 ДП
User 90721916
а, все збс, пропустил начало пути в импорте внутри, вебпак хотя бы кусок пути требует https://webpack.js.org/api/module-methods/#import-  (Fully dynamic statements, such as import(foo), will fail because webpack requires at least some file location information)
07:56:28 ДП
User 67164223
Хелпаните пожалуйста.

Как мне добавить в сбоку css в url baseUrl?
07:56:46 ДП
User 67164223
в css есть bg url(Images/...)
07:57:04 ДП
User 67164223
на выходе я хочу получить url(xxx/Images/...)
07:57:13 ДП
User 67164223
чем это можно разрулить?
09:06:50 ДП
User 117980454
Ребят, привет.

Кто-нибудь сталкивался с ошибкой в Next.js следующего характера:
Использую плагин moment-locales-webpack-plugin версии 1.0.5
webpack : "3.10.0",
next: "5.0.0"

Впадает ошибка:
Cannot read property 'contextModuleFactory' of undefined
это связано с ContextReplacementPlugin

Если делаю без вышеуказанного модуля
config.plugins.push(new webpack.ContextReplacementPlugin(/moment[/\\]locale$/, /en/))
Впадает таже самая ошибка:
Cannot read property 'contextModuleFactory' of undefined

Конфиг webpack вот такой: https://gist.github.com/dipiash/ba1df7336db73826d511a4e47f7ffc54

Может подскажите направление куда копать?
gist.github.com/dipiash/ba1df7336db73826d511a4e47f7ffc54
09:15:46 ДП
User 67164223
User 117980454
Ребят, привет.

Кто-нибудь сталкивался с ошибкой в Next.js следующего характера:
Использую плагин moment-locales-webpack-plugin версии 1.0.5
webpack : "3.10.0",
next: "5.0.0"

Впадает ошибка:
Cannot read property 'contextModuleFactory' of undefined
это связано с ContextReplacementPlugin

Если делаю без вышеуказанного модуля
config.plugins.push(new webpack.ContextReplacementPlugin(/moment[/\\]locale$/, /en/))
Впадает таже самая ошибка:
Cannot read property 'contextModuleFactory' of undefined

Конфиг webpack вот такой: https://gist.github.com/dipiash/ba1df7336db73826d511a4e47f7ffc54

Может подскажите направление куда копать?
gist.github.com/dipiash/ba1df7336db73826d511a4e47f7ffc54
ужас, чо с отступами, настрой себе eslint или prettier. 

Я не вижу импорт вебпака поэтому он не может его прочитать
09:16:32 ДП
User 98927472
@rainmen2009 там не учитывая скачивание пакетов, сам чистый билд намногодольше проходит на сервере, чем на локали
09:16:32 ДП
User 98927472
а ты проверил как у вас работает ? Докер или еще что то ? у нас бала такая проблема изза того что мы качали постоянно пакеты а они на сервере качались 100 лет
09:21:46 ДП
User 117980454
User 67164223
ужас, чо с отступами, настрой себе eslint или prettier. 

Я не вижу импорт вебпака поэтому он не может его прочитать
Даже если сделаю 
const webpack = require('webpack');
Та же самая ошибка
09:26:13 ДП
User 117980454
Все, решил проблему - оказывается было 2е разных версии вебпака
09:27:17 ДП
User 30260375
User 90721916
причем, import('one/two/three') находит, а импорт переменной с таким значением фиг
Только часть пути может быть в переменной
11:12:48 ДП
User 145851801
Коллеги, поставил 4й вебпак, вопрос по режимам (mode).
Если не указывать mode, сборка идет с минификацией, получается production по умолчанию. Если указать mode=development, все модули в бандле вызываются через eval.
Как сделать простую сборку, без минификации, но с читаемым кодом, как предыдущие версии собирали?
Кейс - библиотека, пакет, в общем для публикации в npm
11:13:54 ДП
User 67164223
User 145851801
Коллеги, поставил 4й вебпак, вопрос по режимам (mode).
Если не указывать mode, сборка идет с минификацией, получается production по умолчанию. Если указать mode=development, все модули в бандле вызываются через eval.
Как сделать простую сборку, без минификации, но с читаемым кодом, как предыдущие версии собирали?
Кейс - библиотека, пакет, в общем для публикации в npm
я просто webpack запускаю
11:15:16 ДП
User 145851801
User 67164223
я просто webpack запускаю
4.2 версия, минифицирует, при это в консоль варнинг кидает, что mode не выбран
11:15:35 ДП
User 32530886
уже 4.2
11:15:41 ДП
User 32530886
когда там плагины обновятся то
11:17:54 ДП
User 67164223
User 145851801
Коллеги, поставил 4й вебпак, вопрос по режимам (mode).
Если не указывать mode, сборка идет с минификацией, получается production по умолчанию. Если указать mode=development, все модули в бандле вызываются через eval.
Как сделать простую сборку, без минификации, но с читаемым кодом, как предыдущие версии собирали?
Кейс - библиотека, пакет, в общем для публикации в npm
как понять "через eval"?
11:23:48 ДП
User 76662447
User 98927472
ребята подскажите, может кто сталкивался с подобным.

билд проекта вебпаком с отключенным линтером на локали занимает примерно 25сек, на сервере идет 5-6мин

в чем может быть проблема?

локаль - макбук про 16гб операча 2.7 проц, сервак примерно с такими же системками
25 секунд может собираться только билд без минификации
11:24:32 ДП
User 76662447
И очевидно что в прод у вас вряд ли такое пойдёт, поэтому это нормально
11:24:53 ДП
User 76662447
Минификация вполне может занимать пару минут
11:26:13 ДП
User 76662447
Причём для активации минификации не обязательно даже специально её включать, вебпак её без спроса добавит в режимах типа -p
11:26:17 ДП
User 98927472
User 76662447
И очевидно что в прод у вас вряд ли такое пойдёт, поэтому это нормально
Почему это нормально, если я запускаю одни и те же скрипты для билла и получаю такую большую разницу по времени?
11:26:42 ДП
User 76662447
Значит не одни и те же
11:26:59 ДП
User 98927472
Отличный аргумент
11:27:09 ДП
User 32530886
а как ещё
11:27:10 ДП
User 76662447
Сколько весит прод в networks хрома?
11:28:54 ДП
User 98927472
Сек, вещаю из уединенных мест)
11:30:07 ДП
User 145851801
User 67164223
как понять "через eval"?
11:30:15 ДП
User 98927472
Почему именно нетворк хрома? Там разделение на чанки
11:30:18 ДП
User 67164223
Пока вы тут, может знаете?
Хелпаните пожалуйста.
Как мне добавить в сбоку css в url baseUrl?
в css есть bg url(Images/...)
на выходе я хочу получить url(xxx/Images/...)
чем это можно разрулить?
11:30:26 ДП
User 98927472
Я могу общий вес папки сказать
11:30:43 ДП
User 67164223
User 145851801
а как ты хочешь? Чтобы он тебе каждый файл выложил?
11:31:45 ДП
User 145851801
User 67164223
а как ты хочешь? Чтобы он тебе каждый файл выложил?
очевидно да
11:34:30 ДП
User 67164223
User 145851801
очевидно да
хз, я такое даже не видел как делают)
11:34:57 ДП
User 32530886
User 145851801
очевидно да
в деве?
11:35:28 ДП
User 32530886
User 145851801
Коллеги, поставил 4й вебпак, вопрос по режимам (mode).
Если не указывать mode, сборка идет с минификацией, получается production по умолчанию. Если указать mode=development, все модули в бандле вызываются через eval.
Как сделать простую сборку, без минификации, но с читаемым кодом, как предыдущие версии собирали?
Кейс - библиотека, пакет, в общем для публикации в npm
по идее поменять devtool
11:35:51 ДП
User 32530886
https://webpack.js.org/configuration/devtool/
11:38:38 ДП
User 145851801
User 32530886
по идее поменять devtool
в точку, спасибо!

development mode по умолчанию eval юзает, не додумался
11:39:47 ДП
User 145851801
Совершенно не радует необходимость выбирать из двух mode, без возможности их отключить
11:39:53 ДП
User 1040677
User 145851801
в точку, спасибо!

development mode по умолчанию eval юзает, не додумался
А можно без eval?
11:40:10 ДП
User 145851801
User 1040677
А можно без eval?
выше ссылка на документацию
11:40:59 ДП
User 1040677
Ааа сенкс))
11:41:18 ДП
User 1040677
Вот когда всю доку перепишут под 4ку
11:43:38 ДП
User 32530886
User 145851801
Совершенно не радует необходимость выбирать из двух mode, без возможности их отключить
зачем отключать?
11:44:11 ДП
User 145851801
User 145851801
Совершенно не радует необходимость выбирать из двух mode, без возможности их отключить
Беру свои слова назад, только что изменив одну строчку, собрал обычный и min сборки для пакета, все оч удобно
11:45:17 ДП
User 145851801
User 32530886
зачем отключать?
все ок, изначально просто много времени потратил на этот eval
11:45:32 ДП
User 32530886
User 145851801
все ок, изначально просто много времени потратил на этот eval
выглядит круто
11:45:47 ДП
11:45:54 ДП
User 32530886
а почему target umd?
11:46:44 ДП
User 1040677
User 145851801
все ок, изначально просто много времени потратил на этот eval
МОжешь показать как выглядит package.json?
11:47:07 ДП
User 112715267
User 145851801
Совершенно не радует необходимость выбирать из двух mode, без возможности их отключить
Там же есть какой-то mode дополнительный, не?
11:47:27 ДП
User 145851801
User 32530886
а почему target umd?
пока эксперементирую, маловато актуальных статей на эту тему
11:47:40 ДП
User 145851801
как минимум надо es модули делать и common js получается
11:47:47 ДП
User 145851801
User 112715267
Там же есть какой-то mode дополнительный, не?
неа, всего 2
11:48:18 ДП
User 145851801
User 1040677
МОжешь показать как выглядит package.json?
11:49:12 ДП
User 1040677
Стоп а как определяется у тебя это production или build?
11:50:33 ДП
User 145851801
User 1040677
Стоп а как определяется у тебя это production или build?
посмотри конфиг выше, опция mode
11:51:21 ДП
User 1040677
А как запускаешь в терминале?
11:52:21 ДП
User 67164223
User 145851801
все ок, изначально просто много времени потратил на этот eval
зачем тебе в продакшн девтул?
11:52:24 ДП
User 246872810
Всем привет. Есть вопрос интересный. Когда у меня на маке запущен вебпак, то раза 3 в день включаются, и ооочень сильно начинают работать вентиляторы. Кто-то сталкивался с такой проблемой?
11:52:37 ДП
User 32530886
User 67164223
зачем тебе в продакшн девтул?
чувак делает сразу 2 сборки
11:52:40 ДП
User 32530886
вот и всё
11:52:56 ДП
User 212795634
User 32530886
чувак делает сразу 2 сборки
и они в одном потоке идут?
11:53:10 ДП
User 67164223
User 246872810
Всем привет. Есть вопрос интересный. Когда у меня на маке запущен вебпак, то раза 3 в день включаются, и ооочень сильно начинают работать вентиляторы. Кто-то сталкивался с такой проблемой?
это мак
11:53:19 ДП
11:53:28 ДП
User 145851801
User 212795634
и они в одном потоке идут?
надо уточнить, но кажется вебпак последовательно собирает
11:53:50 ДП
User 67164223
User 246872810
и?
ща бы на ноуте запускать тяжелые приложения
11:53:55 ДП
User 212795634
User 145851801
надо уточнить, но кажется вебпак последовательно собирает
ну точно не параллельно
11:53:56 ДП
User 32530886
User 212795634
и они в одном потоке идут?
в разных вроде
11:54:02 ДП
User 212795634
User 32530886
в разных вроде
с каких пор то?
11:54:05 ДП
User 122087672
User 67164223
ща бы на ноуте запускать тяжелые приложения
макбук замечательно справляется
11:54:20 ДП
User 32530886
User 212795634
с каких пор то?
вроде как с тех как появилась возмность вернуть массив конфигов
11:54:58 ДП
User 67164223
module.exports = () =>
  (isProd ?
    merge([common, extractCSS()])
    :
    merge([common, { devtool: 'cheap-module-source-map' }, devServer(), css()])
  );

я вот так делаю
11:55:19 ДП
User 32530886
так я тоже
11:55:25 ДП
User 32530886
но тут другой кейс
11:57:59 ДП
User 182613717
если просто собрать надо, то в вебпаке есть mode none который отключает вообще всё
11:58:32 ДП
User 182613717
в четвёртом*
11:59:44 ДП
User 145851801
User 182613717
если просто собрать надо, то в вебпаке есть mode none который отключает вообще всё
о, а я не нашел такой инфы) спасибо!
12:00:36 ПП
User 182613717
потому что это недокументированная фича, примерно как опция enforce у splitChunks ¯\_(ツ)_/¯
12:01:23 ПП
User 145851801
User 182613717
потому что это недокументированная фича, примерно как опция enforce у splitChunks ¯\_(ツ)_/¯
частичная документация)) стоит левый mode ввести и все объясняют
12:01:31 ПП
User 145851801
конечно зачем это в доках писать
12:09:37 ПП
User 67164223
User 145851801
конечно зачем это в доках писать
так дока не написана еще
02:34:28 ПП
02:34:37 ПП
User 67164223
Еще раз попробую
02:34:47 ПП
User 67164223
подскажите с файл лоадером
02:35:14 ПП
User 67164223
loader: 'file-loader',
            options: {
              name: '[name].[ext]',
              publicPath: '/xxx/',
              outputPath: 'fonts/',
02:35:22 ПП
User 67164223
loader: 'file-loader',
            options: {
              name: '[name].[ext]',
              publicPath: '/xxx/',
              outputPath: 'img/'
02:35:38 ПП
User 67164223
почему в css для шрифтов он делает путь xxx/fonts
02:35:41 ПП
User 67164223
а для картинок нет?
02:37:02 ПП
02:37:23 ПП
User 67164223
в index.js import './main.scss'
02:37:36 ПП
User 67164223
`
main.scss
body {
  background-image: url("/img/browser.jpg");
}
``
02:37:58 ПП
User 134905826
покажи test от лоадера, не понятно
02:38:30 ПП
User 322514637
привет!
может, кто знает как реализовать? 
https://toster.ru/q/515897
toster.ru/q/515897
Ожидают ответа 1 человек. Станьте первым, кто даст ответ! Или подпишитесь на вопрос, чтобы узнать ответ, когда он появится.
02:38:35 ПП
User 67164223
User 134905826
покажи test от лоадера, не понятно
test: /\.(png|svg|jpe?g|gif)$/,
        use: [
          {
            loader: 'file-loader',
            options: {
              name: '[name].[ext]',
              publicPath: '/xxx/',
              outputPath: 'img/'
02:42:07 ПП
User 67164223
User 134905826
покажи test от лоадера, не понятно
есть идеи?
02:46:29 ПП
User 134905826
User 67164223
есть идеи?
перепроверил у себя, publicPath работает и для шрифтов и для картинок, вероятно в другом месте конфига проблема.
03:13:20 ПП
User 213704994
config.optimization.minimize имеет те же настройки, что и Uglify, раз там по умолчанию Uglify?
03:28:07 ПП
User 213704994
User 213704994
config.optimization.minimize имеет те же настройки, что и Uglify, раз там по умолчанию Uglify?
сам спросил, сам ответил, настройки следующие:

    optimization: {
        minimizer: [
            new UglifyJSPlugin({
                uglifyOptions: {
                 ...
                 }
            })
        ]
    }
03:52:35 ПП
User 414846440
чёт у меня проект поломался ребяттт..... ..... .
TypeError: Cannot read property 'compile' of undefined
😤😤😤
03:53:27 ПП
User 414846440
подозреваю проблема в том что версии webpack-dev-server и webpack не совподают. Но что надо сделать, я не понимаю
03:54:21 ПП
User 322514637
привет!
может, кто знает как реализовать? 
https://toster.ru/q/515897
toster.ru/q/515897
Ожидают ответа 1 человек. Станьте первым, кто даст ответ! Или подпишитесь на вопрос, чтобы узнать ответ, когда он появится.
03:56:08 ПП
User 212795634
User 322514637
привет!
может, кто знает как реализовать? 
https://toster.ru/q/515897
toster.ru/q/515897
Ожидают ответа 1 человек. Станьте первым, кто даст ответ! Или подпишитесь на вопрос, чтобы узнать ответ, когда он появится.
Не ставить свг на фон
03:57:05 ПП
User 322514637
User 212795634
Не ставить свг на фон
а как лучше, чтобы цвет из переменной SASS брался?
03:57:30 ПП
User 212795634
User 322514637
а как лучше, чтобы цвет из переменной SASS брался?
Вставить свг через бабель плагин и стилизовать через цсс
03:57:58 ПП
User 212795634
Короче чтобы он инлайном был в коде
03:58:19 ПП
User 134905826
https://www.npmjs.com/package/postcss-svg
npmjs.com/package/postcss-svg
Inline SVGs in CSS. Supports SVG Fragments, SVG Parameters.
03:58:49 ПП
User 322514637
User 212795634
Короче чтобы он инлайном был в коде
у меня элементов может быть таких много, с  свг-фоном. Разумно ли здесь инлайном?
03:59:18 ПП
User 212795634
User 322514637
у меня элементов может быть таких много, с  свг-фоном. Разумно ли здесь инлайном?
Иначе не сможешь стилизовать
03:59:32 ПП
User 212795634
Вон чето скинули, возможно тоже норм
04:01:48 ПП
User 322514637
User 134905826
https://www.npmjs.com/package/postcss-svg
npmjs.com/package/postcss-svg
Inline SVGs in CSS. Supports SVG Fragments, SVG Parameters.
спасибо, попробую
05:54:47 ПП
User 145851801
Есть ли стандарты для npm пакетов, по указанию необходимых полифиллов? Например код в es5 транспилируется, а при этом используются промисы или Map / Set, просто указывать в ридми?
05:56:12 ПП
User 145851801
или как externals объявлять эти апи?
05:57:12 ПП
User 32530886
User 145851801
Есть ли стандарты для npm пакетов, по указанию необходимых полифиллов? Например код в es5 транспилируется, а при этом используются промисы или Map / Set, просто указывать в ридми?
во первых указываешь версию ноды в package.json engines.node
и перечисляешь что юзаешь
05:58:44 ПП
User 145851801
User 32530886
во первых указываешь версию ноды в package.json engines.node
и перечисляешь что юзаешь
перечисляю соответственно в ридми?
05:58:48 ПП
05:58:52 ПП
User 145851801
версия ноды как я понимаю для сборки нужна только
05:59:13 ПП
User 32530886
при попытке установить npm скажет о несоответствии
05:59:38 ПП
User 145851801
спасибо)