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

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

974 members

Архив канала @webpack_ru 23 ноября 2017 г.

12:01:48 ДП
User 215655868
посмотрел исходники билда, вообщем он рабоатет без опций, по дефолту, но... если я в приложение подключаю css, то вываливаеться ошибка и не компилиться. У меня настроенны плагины на css и все работает, но с babel-plugin-external-helpers сборка валиться если в App подключены стили
12:02:27 ДП
12:04:03 ДП
User 215655868
вот мой конф
https://gist.github.com/SergProduction/b1c7d333aedbdf1b67ab5864fd7e4eaa
12:15:35 ДП
User 112715267
Народ, что за хуйня, в роллапе не работает babel-preset-env?
12:16:01 ДП
User 112715267
Весь репозиторий в вопросах по этому поводу, а ответов нема
12:16:59 ДП
User 112715267
Вроде все по их гайду сделал
.babelrc
{
  "presets": [
    [
      "env",
      {
        "modules": false
      }
    ]
  ],
  "plugins": [
    "external-helpers"
  ]
}
И в rollup.config.js
plugins: [
    resolve({ jsnext: true }),
    cjs(),
    babel()
]
12:21:34 ДП
User 146658406
А зачем этот пресет нужен ?
04:06:01 ДП
User 120165225
Ребята
на что намекает вебпак
Unexpected token operator «*», expected punc «(» [
при деплойе
04:06:36 ДП
User 120165225
там где он указывает ошибку строк function* () {
04:07:58 ДП
User 97102774
User 120165225
там где он указывает ошибку строк function* () {
Уверен, что у тебя  поддерживаются генераторы?
04:09:38 ДП
User 120165225
у меня проект на Rails, gem Webpacker
там настройки для вебпака все по умолчанию
на деве все работает
при деплоей на сервер при помощи capistrano
на этапе компиляциии weppack выдает эту ошибку
04:10:12 ДП
User 120165225
ERROR in 1-83f1e20a5bbcc73b42a0.chunk.js from UglifyJs
04:10:35 ДП
User 120165225
Unexpected token operator «*», expected punc «(» [/home/deploy/apps/
04:11:20 ДП
User 120165225
node_modules/crypto-pro/src/apiAsync.js:21,0][1-83f1e20a5bbcc73b42a0.chunk.js:26,40]
04:11:33 ДП
User 97102774
Скорее всего у тебя в деве был отключен uglify, поэтому норм было.
04:11:47 ДП
User 120165225
наверно
04:11:56 ДП
User 97102774
А для прода ты его включаешь, а он о генераторах ничего не знает.
04:12:05 ДП
User 120165225
babelrc
{
  "presets": [
    ["env", {
    ¦ "modules": false,
    ¦ "targets": {
    ¦   "browsers": "> 1%",
    ¦   "uglify": true
    ¦ },
    ¦ "useBuiltIns": true
    }]
  ],

  "plugins": [
    "syntax-dynamic-import",
    "transform-object-rest-spread",
    ["transform-class-properties", { "spec": true }]
  ]
}
04:12:40 ДП
User 120165225
User 97102774
А для прода ты его включаешь, а он о генераторах ничего не знает.
на какую сторону копать?
04:13:11 ДП
User 120165225
может этот Uglify вообще надо вырубить
04:13:28 ДП
User 97102774
https://babeljs.io/docs/usage/polyfill/
babeljs.io/docs/en/babel-polyfill
Babel includes a [polyfill](https://en.wikipedia.org/wiki/Polyfill_(programming)) that includes a custom [regenerator runtime](https://github.com/facebook/regenerator/blob/master/packages/regenerator-runtime/runtime.js) and [core-js](https://github.com/zloirock/core-js).
04:13:40 ДП
User 97102774
Вот эту штуку подключи. Uglify не надо отключать.
04:13:57 ДП
User 120165225
все эти бейблы gem wepacker все сам тянет
04:16:56 ДП
User 120165225
Вот что пишет разработчик библиотеки

https://github.com/vgoma/crypto-pro

    <!— Полифиллы для работы библиотеки —>
    <script src="polyfills/addEventListener.js"></script>
    <script src="polyfills/promise.js"></script>
    <script src="polyfills/forEach.js"></script>
    <script src="polyfills/map.js"></script>
но у меня же на деве  и без них работает
github.com/vgoma/crypto-pro
crypto-pro - API для взаимодействия с КриптоПро
04:20:02 ДП
User 134905826
User 120165225
Вот что пишет разработчик библиотеки

https://github.com/vgoma/crypto-pro

    <!— Полифиллы для работы библиотеки —>
    <script src="polyfills/addEventListener.js"></script>
    <script src="polyfills/promise.js"></script>
    <script src="polyfills/forEach.js"></script>
    <script src="polyfills/map.js"></script>
но у меня же на деве  и без них работает
github.com/vgoma/crypto-pro
crypto-pro - API для взаимодействия с КриптоПро
это норма — канечно работает, если в хроме тестируеш. полифилы нужны другим браузерам.
04:28:43 ДП
User 97102774
User 120165225
Вот что пишет разработчик библиотеки

https://github.com/vgoma/crypto-pro

    <!— Полифиллы для работы библиотеки —>
    <script src="polyfills/addEventListener.js"></script>
    <script src="polyfills/promise.js"></script>
    <script src="polyfills/forEach.js"></script>
    <script src="polyfills/map.js"></script>
но у меня же на деве  и без них работает
github.com/vgoma/crypto-pro
crypto-pro - API для взаимодействия с КриптоПро
Открой в IE11 и посмотри.
05:18:45 ДП
User 120165225
ну это попомему не то, мне шас нужно чтобы вебпак нормально скомпилил на проде
05:32:14 ДП
User 134905826
User 120165225
ну это попомему не то, мне шас нужно чтобы вебпак нормально скомпилил на проде
https://babeljs.io/docs/plugins/transform-regenerator/
babeljs.io/docs/plugins/transform-regenerator
The compiler for writing next generation JavaScript
05:40:00 ДП
User 120165225
User 134905826
https://babeljs.io/docs/plugins/transform-regenerator/
babeljs.io/docs/plugins/transform-regenerator
The compiler for writing next generation JavaScript
вроде как зависимость подключается webpacker-ом
но в baberc не прописан
05:42:50 ДП
User 120165225
{
   "presets": [
     ["env", {
     ¦ "modules": false,
     ¦ "targets": {
     ¦   "browsers": "> 1%",
     ¦   "uglify": true
     ¦ },
     ¦ "useBuiltIns": true
     }]
   ],

   "plugins": [
     "transform-regenerator",
     "syntax-dynamic-import",
     "transform-object-rest-spread",
     ["transform-class-properties", { "spec": true }]
   ]
 }
не помогло
05:45:32 ДП
User 134905826
тут по конфигам никто не гадает, тебе надо разобраться самому — с поключением transform-regenerator, он должен трансформировать function *, тем самым удружить uglifyjs
05:49:10 ДП
User 120165225
User 134905826
тут по конфигам никто не гадает, тебе надо разобраться самому — с поключением transform-regenerator, он должен трансформировать function *, тем самым удружить uglifyjs
на прод сервере зашел вижу этот самый чанк где ошибка
и он не упакованный, а как обычный файл исходника crypto-pro
может это нормально, хз
а если на проде еще запускаю webpack вручную он срабатывает без ошибок, и появляется новый чанк уже упакованный
05:49:58 ДП
User 120165225
конфиг типовой, от гема webpacker для рельцов
05:53:29 ДП
User 120165225
у меня на деве Nodejs версия 8
на проде 6 версия
это может влиять?
05:54:20 ДП
User 134905826
6-я — может
05:56:09 ДП
User 155513348
как сделать так, чтобы при хотрелоаде и собирался в билд конкретный файл?
06:00:08 ДП
User 134905826
User 155513348
как сделать так, чтобы при хотрелоаде и собирался в билд конкретный файл?
вопрос про watch mode? там магия incremental builds — вебпак сам решает что надо а что нет. я не встречал способа как билдить конкретный.
06:00:29 ДП
User 155513348
понял
06:00:32 ДП
User 155513348
ну да, watch mode
06:06:37 ДП
User 120165225
User 134905826
6-я — может
хотя нет
попробовал на деве собрать как на проде
NODE_ENV=production webpack —progress
получил ту же ошибку
06:11:24 ДП
User 120165225
оказывается проблема именно у пакета crypto-pro, без него нормально компилит
так что же делать?
08:56:02 ДП
User 120165225
вобщем не понятно
как вебпак заставить компилить из es6 в es5
08:56:20 ДП
User 30260375
User 120165225
вобщем не понятно
как вебпак заставить компилить из es6 в es5
Babel же
08:58:13 ДП
User 120165225
Фнукции
function * qwe() {}
это же es6?
08:58:41 ДП
User 3504523
User 120165225
Фнукции
function * qwe() {}
это же es6?
да, это генератор
09:04:47 ДП
User 120165225
может и компилирует норм
но вижу что создается 2 chunk
один компилированный другой нет
и на 2 конечно ругается что fuction* () не понятный
09:05:26 ДП
User 147771380
User 120165225
может и компилирует норм
но вижу что создается 2 chunk
один компилированный другой нет
и на 2 конечно ругается что fuction* () не понятный
Babel
09:06:20 ДП
User 189706357
User 120165225
может и компилирует норм
но вижу что создается 2 chunk
один компилированный другой нет
и на 2 конечно ругается что fuction* () не понятный
Добавь в конфиг чтоб бабел транспилил плагины из нод модулес.
09:10:25 ДП
User 212795634
Мда а как генераторы он затранспилит в ес5?
09:11:15 ДП
User 120165225
User 189706357
Добавь в конфиг чтоб бабел транспилил плагины из нод модулес.
а вот тут уже замучался, может подскажете? :)
09:12:36 ДП
User 147771380
User 212795634
Мда а как генераторы он затранспилит в ес5?
regeneratorRuntime
09:12:41 ДП
User 189706357
User 212795634
Мда а как генераторы он затранспилит в ес5?
Транспилит как-то )
09:13:43 ДП
User 147771380
User 189706357
Транспилит как-то )
Сам по себе не транспилит
09:13:50 ДП
User 147771380
regeneratorRuntime надо
09:14:35 ДП
User 189706357
User 147771380
Сам по себе не транспилит
Какой плагин к бабелю нужен? Transform runtime?
09:15:04 ДП
User 3504523
...
  "plugins": [
    "transform-runtime",
    "transform-regenerator"
  ]
...
09:15:37 ДП
User 147771380
Или babel-polyfill
09:44:39 ДП
User 120165225
https://toster.ru/q/443260
тут похожая ситуация
toster.ru/q/443260
Ответили на вопрос 3 человека. Оцените лучшие ответы! И подпишитесь на вопрос, чтобы узнавать о появлении новых ответов.
09:44:48 ДП
User 120165225
и видимо решения нет
09:45:28 ДП
User 30260375
Используй минификатор бабеля
09:45:42 ДП
User 30260375
Либо closure compiler
09:47:53 ДП
User 215655868
Доброй ночи. Подскажите, как подключить babel-plugin-external-helpers долго гуглил, не чего не нашел в связки вебпака
09:47:53 ДП
User 215655868
посмотрел исходники билда, вообщем он рабоатет без опций, по дефолту, но... если я в приложение подключаю css, то вываливаеться ошибка и не компилиться. У меня настроенны плагины на css и все работает, но с babel-plugin-external-helpers сборка валиться если в App подключены стили
09:47:53 ДП
09:48:23 ДП
User 215655868
вот мой конф
https://gist.github.com/SergProduction/b1c7d333aedbdf1b67ab5864fd7e4eaa
10:42:41 ДП
User 52321317
User 215655868
Доброй ночи. Подскажите, как подключить babel-plugin-external-helpers долго гуглил, не чего не нашел в связки вебпака
а почему просто не использовать плагин для babel? Зачем это сувать в webpack?
10:43:00 ДП
User 52321317
https://babeljs.io/docs/plugins/external-helpers/
babeljs.io/docs/plugins/external-helpers
The compiler for writing next generation JavaScript
11:10:45 ДП
User 215655868
User 52321317
а почему просто не использовать плагин для babel? Зачем это сувать в webpack?
компилить каждый раз руками через babel-cli ? Не совсем понимаю в чем выгода так делать, к тому же у меня dev server в вебпаке есть
11:11:33 ДП
User 52321317
в вебпаке можно передать плагины в babel. Вот туда и писать этот плагин. Причем тут babel-cli?
11:11:40 ДП
User 32530886
User 52321317
в вебпаке можно передать плагины в babel. Вот туда и писать этот плагин. Причем тут babel-cli?
Смысл?
11:11:53 ДП
User 32530886
Нужно уменьшить количество хелперов
11:12:00 ДП
User 32530886
То есть где-то их надо будет подключить
11:12:30 ДП
User 215655868
подлючаеться и работает, но с стилями не работает
03:08:42 ПП
03:08:43 ПП
User 347161968
Ребята кто-то сталкивался с такой проблемой при настройке вебпака? Я уже удалил все лишнее из файла, оставил один лоадер, но вебпак все-равно не хочет понимать jsx. Может быть подскажете где я ошибся? Несколько часов мучаюсь, переписываю этот конфиг, в новом проекте работает, в нужном проекте отлавливаю такую ошибку.... 

Вот код лоадера: 

module: {
        rules: [{
            test: /\.jsx?$/,
            include: path.resolve(__dirname, 'src'),
            exclude: /node_modules/,
            use: 'babel-loader'
        }]
    }
03:08:59 ПП
User 347161968
Последнее действие – обновился до вебпака 3.8
03:17:06 ПП
User 67164223
User 347161968
Последнее действие – обновился до вебпака 3.8
Надо весь конфиг смотрет
03:18:58 ПП
User 347161968
User 67164223
Надо весь конфиг смотрет
Он собирается в пустом проекте и видит jsx.. может не в конфиге проблема? 

https://gist.github.com/VladTrostinsky/a0a544e40e32558f8fc0b7d18d96f59a

Вот ссылка на конфиг
gist.github.com/VladTrostinsky/a0a544e40e32558f8fc0b7d18d96f59a
03:19:38 ПП
User 67164223
Убери резолв и напиши путь
03:37:25 ПП
User 32530886
User 347161968
Он собирается в пустом проекте и видит jsx.. может не в конфиге проблема? 

https://gist.github.com/VladTrostinsky/a0a544e40e32558f8fc0b7d18d96f59a

Вот ссылка на конфиг
gist.github.com/VladTrostinsky/a0a544e40e32558f8fc0b7d18d96f59a
include и exclude не надо вместе юзать
03:37:37 ПП
User 32530886
убери include
03:38:51 ПП
User 347161968
User 32530886
убери include
Убрал, походу дело не в этом... А возможно ли что дело в том, что сама верстка у меня внутри проекта на node.js? Инетгрированна внутрь? Потому что когда я перемещаю проект с версткой, все начинает работать
04:01:55 ПП
User 78183802
Ребят, выручайте....почему нет jquery в глобальной области видимости после сборки webpack:
04:01:55 ПП
04:01:55 ПП
04:01:55 ПП
04:01:55 ПП
User 78183802
понимаю, что что то не догоняю...а что не могу понять. Уже весь гугл просмотрел
04:02:30 ПП
User 78183802
Кажется что что то очевидное не делаю) привет всем)
05:17:53 ПП
User 52321317
import $ from jquery;
window.$ = jquery;

:DDDDD
05:25:26 ПП
User 78183802
Это в файле main.js?
А если потом подключается либа типо  select2, то она тоже будет работать при вызове $(). select2()?
05:26:10 ПП
User 78183802
Или ее тоже по особому надо пожключить? Или import  select2 досьаточно?
05:32:59 ПП
User 78183802
И почему тогда не работает provideplugin? Или он для другого?
05:34:44 ПП
User 78183802
Сорян за кучу вопросов, просто уже понять хочу как это работает)
06:07:44 ПП
User 60331718
User 78183802
Сорян за кучу вопросов, просто уже понять хочу как это работает)
Потому что jquery нет в виде npm пакета же
06:08:09 ПП
User 66817777
User 60331718
Потому что jquery нет в виде npm пакета же
Отличная идея для стартапа
06:08:28 ПП
User 212795634
User 60331718
Потому что jquery нет в виде npm пакета же
да?
06:08:29 ПП
User 212795634
https://www.npmjs.com/package/jquery
npmjs.com/package/jquery
JavaScript library for DOM operations
06:09:24 ПП
User 60331718
Я стал слишком стар для этого дерьма
06:09:40 ПП
User 60331718
Всегда его как external зависимость подключал, когда нужно было О.о
06:13:59 ПП
User 300024
User 78183802
Сорян за кучу вопросов, просто уже понять хочу как это работает)
Слушай, когда в доке реакта на примере жиквери написано как работать с ним, а на странице provideplugin на его же примере рассказано как подключать, я предлагаю сначала так сделать, потом спросить
06:24:23 ПП
User 78183802
User 300024
Слушай, когда в доке реакта на примере жиквери написано как работать с ним, а на странице provideplugin на его же примере рассказано как подключать, я предлагаю сначала так сделать, потом спросить
дак смотри на скрины, вроде сделал все как в доках написано
06:24:59 ПП
User 78183802
сейчас уже в тупике, значит что то конкретно не понимаю, потому и задал вопрос тут
06:34:49 ПП
User 300024
User 78183802
сейчас уже в тупике, значит что то конкретно не понимаю, потому и задал вопрос тут
тебе было лень читать
пробуй
https://gist.github.com/rlax/013274d14c3f8ee0382eecae3c69d89c
gist.github.com/rlax/013274d14c3f8ee0382eecae3c69d89c
06:35:21 ПП
User 32530886
User 60331718
Потому что jquery нет в виде npm пакета же
Есть же
06:35:32 ПП
User 60331718
User 32530886
Есть же
Ога :/
06:35:59 ПП
User 300024
User 78183802
сейчас уже в тупике, значит что то конкретно не понимаю, потому и задал вопрос тут
не делай так
06:36:00 ПП
User 300024
вот скриншот в твоем стиле
06:36:39 ПП
User 78183802
ого, да ты крут. Только не работает так
06:36:52 ПП
User 78183802
точнее ответ не на вопрос
06:36:57 ПП
User 226954955
User 78183802
Сорян за кучу вопросов, просто уже понять хочу как это работает)
Expose-loader пробовал?
06:37:13 ПП
User 226954955
Или export-loader
06:37:47 ПП
User 78183802
User 226954955
Expose-loader пробовал?
нет, спасибо, буду их смотреть
06:37:57 ПП
User 226954955
Provide plugin он для другого немного, кмк
06:40:08 ПП
User 78183802
а для чего, можешь пояснить в кратце, если не затруднит конечно? потому как по доке считал он именно так и должен  работать, или он работает только во внутренних компонентах?
06:41:14 ПП
User 226954955
Он для переменных внутри бандла
06:42:24 ПП
User 78183802
ааа, вот где собака зарыта...@GeorgeBorzilov  спасибо тебе огромное!)
06:44:37 ПП
User 226954955
Так а почему ты плагин для jQuery через webpack не бандлишь?
06:45:30 ПП
User 78183802
дак так и делаю, просто есть внешний скрипт, который пока не могу засунуть в бандл, но он требует jquery
06:47:02 ПП
06:47:02 ПП
User 226954955
Это в файле main.js?
А если потом подключается либа типо  select2, то она тоже будет работать при вызове $(). select2()?
06:47:21 ПП
06:48:54 ПП
User 78183802
да, там в коде html есть скрипт на одной из страниц. Пока вынести его в бандл не могу. Там идет вызов $(elem).select2({}), соответственно нужна jquery в глобальной видимости. И нужно чтобы select2 на нее еще встал =\
06:49:41 ПП
06:50:17 ПП
User 78183802
не говори =\
06:51:19 ПП
User 78183802
я уже даже жалеть начал что на вебпак стал переводить...работало раньше и хрен с ним)))
06:51:57 ПП
User 30260375
Подключай в html эти либы и забей
06:52:10 ПП
User 78183802
вот так и было сделано)))
06:52:17 ПП
User 30260375
У меня с datarangepicer такая же проблема
06:52:49 ПП
User 66817777
User 78183802
я уже даже жалеть начал что на вебпак стал переводить...работало раньше и хрен с ним)))
Хей
Не сдавайся 
Ты сможешь, чувак'
06:53:03 ПП
User 226954955
Ну напиши как с лоадером завелась или нет
06:53:13 ПП
User 30260375
User 78183802
да, там в коде html есть скрипт на одной из страниц. Пока вынести его в бандл не могу. Там идет вызов $(elem).select2({}), соответственно нужна jquery в глобальной видимости. И нужно чтобы select2 на нее еще встал =\
Можно просто не юзать такие конструкции
06:53:14 ПП
User 226954955
Аж интересно
06:53:24 ПП
User 78183802
User 226954955
Expose-loader пробовал?
вот это помогло....
06:53:56 ПП
User 78183802
User 30260375
Можно просто не юзать такие конструкции
обязательно, но не все сразу, а то потом не найдешь концы что где посыпалось
06:57:16 ПП
User 78183802
@GeorgeBorzilov вот только не пойму с бутстрапом. Везде пишут что ProvidePlugin должен помочь, но стоит мне убрать бутстрап в бандл - он ругается что нет jquery.
06:58:33 ПП
User 226954955
Так тебе нужен и плагин и лоадер
06:59:11 ПП
User 78183802
лоадер bootstrap-loader?
06:59:33 ПП
User 78183802
если тот что ты выше рекомендовал - то он стоит
06:59:34 ПП
User 226954955
Секунду
06:59:51 ПП
User 226954955
Bootstrap css?
07:00:20 ПП
07:00:24 ПП
User 78183802
3 версия
07:12:45 ПП
User 226954955
https://github.com/gdi2290/angular-starter/issues/696#issuecomment-227786637
github.com/gdi2290/angular-starter/issues/696
Hi, I have taken a look at #214 &amp; #215, but these don't really explain how to setup bootstrap 3. I also tried going on the slack chat page, but that seems to be broken. I have installed the npm packages for jquery &amp; bootstrap, and then a...
07:14:29 ПП
User 226954955
только я никогда не юзал так )))
07:17:46 ПП
User 78183802
Это я видел, но чет пока переставлять бутстрап не хочу...
Кажется понял, тут это мой косяк...все должно работать, просто jquery не та версия в конфиге подключена. Завтра проверю эту теорию, но должно заработать) 
Еще раз спасибо за помощь!)