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

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

974 members

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

06:22:00 ДП
User 429401448
5 месяцев не трогал node_modules от вебпака, babel и еще пары смежных пакетов
06:22:38 ДП
User 429401448
сегодня npm install сделал, в итоге node_modules из 12мб в 36 увеличился
06:23:01 ДП
User 429401448
Это вообще законно?
06:23:55 ДП
06:24:01 ДП
User 160061898
а package.lock у тебя был?
06:25:21 ДП
User 160061898
User 207638731
Как в eslint вывести ошибки в браузер?
Никак
06:25:48 ДП
User 160061898
как-то линковать оутпут утилиты с со своим приложением, если только так
06:25:57 ДП
User 429401448
User 160061898
а package.lock у тебя был?
Да. Тогда по идее вообще те же самые пакеты должны грузиться и размер не должен измениться, верно?
06:26:14 ДП
User 429401448
Точнее package-lock.json у меня
06:26:21 ДП
User 429401448
Ну тип дефолтный
06:26:24 ДП
06:26:34 ДП
User 134905826
User 160061898
Никак
eslint-loader + devServer overlay ?
06:26:46 ДП
User 160061898
User 134905826
eslint-loader + devServer overlay ?
Ну вот ты и слинковал
06:26:47 ДП
User 429401448
User 160061898
Ага
И что за магия? Почему размер в 3 раза увеличился?
06:28:22 ДП
User 97102774
User 429401448
И что за магия? Почему размер в 3 раза увеличился?
У тебя версии фиксированы?
06:28:59 ДП
User 429401448
User 97102774
У тебя версии фиксированы?
package-lock.json есть, значит фиксированы. Щас буду разбираться, может и поменялись
06:29:12 ДП
User 429401448
По крайней мере это единственное объяснение
06:29:40 ДП
User 160061898
User 134905826
eslint-loader + devServer overlay ?
Кстати зачем eslint-loader, когда eсть есть консольный eslint?)
06:30:28 ДП
User 97102774
User 160061898
Кстати зачем eslint-loader, когда eсть есть консольный eslint?)
Если не ошибаюсь, чтобы при ошибках сборка падала.
06:30:42 ДП
User 160061898
Ну т.е. прямо в процессе написания
06:31:24 ДП
User 160061898
Видимо актуально для работы в vscode
06:31:28 ДП
User 134905826
User 97102774
Если не ошибаюсь, чтобы при ошибках сборка падала.
как настроиш emitErros + emitWarnings и автофикс есть.
06:31:59 ДП
User 160061898
Потому что шторм автоматос тебе светит все твои косяки основываясь на конфиге.
06:32:32 ДП
User 97102774
User 160061898
Видимо актуально для работы в vscode
Я про другое. У тебя сборка не будет проходить, если ты накосячил.
06:32:34 ДП
User 160061898
но все равно круто, надо глянуть как-нить
06:32:59 ДП
User 160061898
User 97102774
Я про другое. У тебя сборка не будет проходить, если ты накосячил.
Да мы примерно об одном и том же
06:33:06 ДП
User 134905826
User 160061898
Потому что шторм автоматос тебе светит все твои косяки основываясь на конфиге.
vscode тоже. но надо донастроить prettier
06:33:10 ДП
User 160061898
Просто ты не косячишь, когда у тебя иде все подсвечивает
06:33:20 ДП
User 97102774
User 160061898
Да мы примерно об одном и том же
Разные вещи. Ты о редакторе. Я о сборке.
06:33:35 ДП
User 97102774
User 160061898
Просто ты не косячишь, когда у тебя иде все подсвечивает
У меня не всегда IDE открыта.
06:33:57 ДП
User 160061898
Ок, у меня просто линтер проходит до сборки
06:34:07 ДП
User 160061898
npm run lint
06:35:53 ДП
User 97102774
User 160061898
Ок, у меня просто линтер проходит до сборки
Так не надёжно. Ещё скажи, что у тебя тесты перед прод сборкой не запускаются.
06:37:19 ДП
User 160061898
в CI пайплайн lint -> build -> test -> deploy
06:37:37 ДП
User 160061898
Надежность тут вроде как не причем, просто у тебя два таска в одном
06:38:28 ДП
User 97102774
User 160061898
Надежность тут вроде как не причем, просто у тебя два таска в одном
Ну, люди у тебя предпочитают долбить CI, вместо того, чтобы у себя на компе прогнать?
06:39:21 ДП
User 97102774
Ладно. Я просто считаю, что сборку надо в вебпаке настраивать, а не во внешней тулзе.
06:41:22 ДП
User 160061898
Ага, в принципе просто не добавлять линтер в дев
06:41:29 ДП
User 160061898
И добавить при сборке в прод
06:50:19 ДП
User 139059931
User 160061898
И добавить при сборке в прод
Это жесть господа! Ставьте линт на прекомит. А то будет так: закомитил -> запушил -> смержил -> билд упал потому что ты запятую забыл поставить у последнего элемента массива :D
06:50:33 ДП
User 160061898
Так и стоит
06:51:01 ДП
User 97102774
User 139059931
Это жесть господа! Ставьте линт на прекомит. А то будет так: закомитил -> запушил -> смержил -> билд упал потому что ты запятую забыл поставить у последнего элемента массива :D
Ставь преттиер на прекоммит.
06:51:09 ДП
User 97102774
Ну и линтер тоже.
06:52:24 ДП
User 139059931
а лучше lint staged :D
06:52:52 ДП
User 97102774
Не суть.
06:54:05 ДП
User 139059931
почему же, надо экономить свое время и процессорное
07:48:46 ДП
User 74755437
User 139059931
Это жесть господа! Ставьте линт на прекомит. А то будет так: закомитил -> запушил -> смержил -> билд упал потому что ты запятую забыл поставить у последнего элемента массива :D
Вот это да. Я на новом проекте попробовал линтовщик на прекомит делать. Плюс запуск локальных тестов ещё. Классная штука.
11:15:31 ДП
User 276188537
Ребята, добрый день. Вопрос такой - У меня несколько pug файлов в исходниках, прогнал эти файлы через соотвествующие лоадеры, но теперь возникает постоянная необходимость при создании нового pug файла добавлять в точку входа, как это все дело до автоматизма довести
11:19:11 ДП
User 276188537
module.exports = {
    context: src.root,
    entry: {
        app: [
            './js/app.js',
            './pages/index.pug',
        ],
    },
    output: {
        filename: 'js/[name].js',
        path: dist.root,
        publicPath: '../'
    },
    module: {
        rules: [
            {
                test: /\.(gif|png|jpe?g|svg|woff)$/,
                use: [
                  {
                    loader: 'file-loader',
                    options: {
                      name: '[path][name].[ext]'
                    }
                  }
                ]
              },
            {
                test: /\.pug$/,
                use: [
                    {
                        loader: 'file-loader',
                        options: {
                            name: '[path][name].html'
                        },
                    },
                    {
                        loader: 'extract-loader'
                    },
                    {
                        loader: 'html-loader'
                    },
                    {
                        loader: 'pug-html-loader',
                        options: {
                            pretty: true,
                        },
                    },
                ],
            },

        ],
    },
}
11:19:28 ДП
User 276188537
Вот сам код
11:20:08 ДП
User 429401448
Что использовать для простого копирования js файла?
11:20:43 ДП
User 429401448
copy-webpack-plugin я так понимаю
11:20:57 ДП
User 488835159
User 276188537
Вот сам код
это конфиг
11:34:19 ДП
User 429550794
Ребята,как  найти/сделать рабочий конфиг под 3 вебпак? если мне нужен не последний реакт это значит я не могу пользоватся 4ым паком,или ставить и не парится? у меня 1 раз получилось сделать рабочий конфиг,полгода назад,и в целом это полная дичь,ставишь одного требует другое,делаешь 1 конфиг ругается то на одно то на другое
11:34:50 ДП
User 429550794
Как понять какие версии,если не последние,мне ставить для проекта?
11:35:31 ДП
User 32530886
User 429550794
Ребята,как  найти/сделать рабочий конфиг под 3 вебпак? если мне нужен не последний реакт это значит я не могу пользоватся 4ым паком,или ставить и не парится? у меня 1 раз получилось сделать рабочий конфиг,полгода назад,и в целом это полная дичь,ставишь одного требует другое,делаешь 1 конфиг ругается то на одно то на другое
Вебпак и реакт не связаны
11:36:50 ДП
User 488835159
вебпердя же
11:36:59 ДП
User 429550794
тоесть,надо ставить все package последних версий? дев-сервер,weback-cli нужен вообще? а ugilifyjs?
11:38:07 ДП
User 32530886
User 429550794
тоесть,надо ставить все package последних версий? дев-сервер,weback-cli нужен вообще? а ugilifyjs?
Да
12:59:23 ПП
User 426516192
User 32530886
Да
10$ же было за час😅😂😆
04:26:05 ПП
User 299096137
Ребята, подскажите как в webpack-chain вставить лоадер по центру куда-нить
04:26:37 ПП
04:27:12 ПП
User 299096137
вот есть мапа uses, хочу вставить svg-fill-loader перед postcss-loader
04:35:58 ПП
User 134905826
User 299096137
Ребята, подскажите как в webpack-chain вставить лоадер по центру куда-нить
я так понял автор webpack-chain любитель gulp и перенесли свои привычки 🙂 использует кто?
04:36:21 ПП
User 299096137
ну автор mozilla-neutrino
04:36:28 ПП
User 299096137
а какие у него там проблемы не знаю
04:37:04 ПП
User 299096137
я же правильно понимаю, что порядок лоадеров важен
04:37:05 ПП
04:41:10 ПП
User 299096137
фух, нашел решение
04:46:41 ПП
User 299096137
ппц какой-то
04:46:59 ПП
User 299096137
как можно такие важные вещи не задокументировать
04:53:05 ПП
User 115191768
что в итоге? как сделал?
04:54:34 ПП
User 160061898
и пока он пишет как сделал. Напомните, как делать импорты, которые зависят от переменной откружения. Например, чтобы полключался дев файл или прод файл в сборку?
04:57:10 ПП
User 55943427
if (process.env.NODE_ENV === 'production') {
04:57:14 ПП
04:57:21 ПП
User 160061898
а потом у меня module.exports
04:57:29 ПП
User 299096137
User 115191768
что в итоге? как сделал?
короче, автор реализовал методы after,before, но не задокументировал
04:57:39 ПП
User 160061898
User 55943427
if (process.env.NODE_ENV === 'production') {
а я хочу import
04:57:44 ПП
User 299096137
оказывается в конце цепочки, нужно использовать их, чтоб указать куда их вставить
04:57:59 ПП
User 299096137
config.module
      .rule('stylus')
      .use('svg-fill-loader')
      .loader('svg-fill-loader/encodeSharp')
      .after('css-loader');
04:58:42 ПП
User 299096137
в доке о методах не слово, сами методы я нашел через дебаггер, потом начал их в ишью искать, ну и в одном из ишью нашел пример использования
04:58:53 ПП
04:58:54 ПП
User 160061898
Собственно из примера redux-dev-tools
04:59:32 ПП
User 160061898
Или просто забить и выключить линтер на это правило?
05:00:02 ПП
User 299096137
положи на это
05:00:15 ПП
User 299096137
ты фронтэндер, почему твои крылья пытается обрезать какой-то линтер
05:06:05 ПП
User 160061898
В целом можно угореть так :D
06:33:45 ПП
User 122087672
User 160061898
В целом можно угореть так :D
так и нужно делать. а вебпак потом ненужную ветку вырежет
08:29:28 ПП
User 183545072
Привет.
Такой ошибки не у кого не было?
Module not found: Error: Can't resolve 'webpack-hot-middleware/client'

"webpack": "^4.0.1",
"webpack-dev-middleware": "^3.0.0",
"webpack-hot-middleware": "^2.21.2"

const devConfig: webpack.Configuration & { mode: string } = {
  // context: __dirname,
  mode: 'development',
  devtool: 'inline-source-map',
  entry: [
    'webpack-hot-middleware/client',
    APP_ENTRY,
  ],
Запускаю через ts-node.
09:13:10 ПП
User 183545072
Так и знал, что это в резолвинге дело, а именно в
    extensions: [
      '.ts',
      '.tsx',
      '.js', // это я не поставил
    ],
Я через ts-node всё запускаю и забыл сказать чтобы js резолвился.