Телеграмм чат группы webpack

2020 September 27

С

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

А если файл переменовать из ts, в js, то такая конструкция будет работать:

import * as $ from 'jquery'
import 'owl.carousel'

источник

12:39пожаловаться #1

y

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

Сергей

Работаю с webpack + typescript + jquey + pluign.

И это сущий ад, нашел решение для того чтобы плагины работали и не выкидывали ошибку что $.fn не найдена:

new webpack.ProvidePlugin({
  $: 'jquery',
  jQuery: 'jquery',
  'window.jQuery': 'jquery'
})

Нормльный ли такой подход?

Пытался делать так:

import * as $ from 'jquery'
import 'owl.carousel'

Но все равно не работало

Что за ошибка?

источник

13:23пожаловаться #2

С

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

ymdev

Что за ошибка?

Пока не дома, покажу все)) Очень интересно разобраться

источник

18:22пожаловаться #3

С

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

Сам пытался, но знаний не хватает

источник

18:23пожаловаться #4

S

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

Как проверить что externals работает?

источник

18:46пожаловаться #5

НС

Никита Сковорода... in Webpack — русскоговорящее сообщество

Sanj

Как проверить что externals работает?

Отключить минификацию или прогнать через prettier руками.

После этого погрепать на require(

Первый шаг не обязателен, просто для удобства.

источник

18:55пожаловаться #6

S

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

Никита Сковорода

Отключить минификацию или прогнать через prettier руками.

После этого погрепать на require(

Первый шаг не обязателен, просто для удобства.

Спасибо , вместо webpack_require должен быть простой require?

источник

18:57пожаловаться #7

НС

Никита Сковорода... in Webpack — русскоговорящее сообщество

Он может быть обёрнут

источник

18:58пожаловаться #8

НС

Никита Сковорода... in Webpack — русскоговорящее сообщество

То есть там может быть webpack_require, но такого, что этот индекс просто возвращает require()

источник

18:59пожаловаться #9

НС

Никита Сковорода... in Webpack — русскоговорящее сообщество

С телефона не покажу, но погрепай на require( и должно стать что-то видно

источник

18:59пожаловаться #10

S

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

Никита Сковорода

С телефона не покажу, но погрепай на require( и должно стать что-то видно

Хорошо, спасибо

источник

19:00пожаловаться #11

S

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

источник

19:53пожаловаться #12

S

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

Есть еще проблема 😂 Использую либу overlayscrollbars component для реакта, как я понял она является es6 модулем , я ставлю exclude как на картинке, но даже с ним и без него в билде появляется такой код:
class OverlayScrollbarsComponent extends a.Component

Как заставить его превратиться в es5 код? Использую terser, babel-loader

источник

19:53пожаловаться #13

И

Илья in Webpack — русскоговорящее сообщество

Олег

А лучше поднять бэк , хранить в бд и отдавать только то что нужно

Мне нужен список шрифтов гугла, его надо тянуть через апи и мне не нужны урлы(json там большой 500кб), можно сделать build скрипт и его писать перед загрузкой но есть идея тянуть сразу из апи и трансформировать во время билда

источник

19:55пожаловаться #14

И

Илья in Webpack — русскоговорящее сообщество

И чтобы лежал рядом в отдельнотчанке и грузился через import

источник

19:55пожаловаться #15

О

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

Илья

Мне нужен список шрифтов гугла, его надо тянуть через апи и мне не нужны урлы(json там большой 500кб), можно сделать build скрипт и его писать перед загрузкой но есть идея тянуть сразу из апи и трансформировать во время билда

Ну ты можешь разбить json на бандлы

источник

19:56пожаловаться #16

И

Илья in Webpack — русскоговорящее сообщество

Олег

Ну ты можешь разбить json на бандлы

Зачем?

источник

20:03пожаловаться #17

S

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

Sanj

Есть еще проблема 😂 Использую либу overlayscrollbars component для реакта, как я понял она является es6 модулем , я ставлю exclude как на картинке, но даже с ним и без него в билде появляется такой код:
class OverlayScrollbarsComponent extends a.Component

Как заставить его превратиться в es5 код? Использую terser, babel-loader

Оказывается в babel 7 если у тебя .babelrc то node modules с es6 кодом почему то не будут транспилироваться даже если захочешь, переименовал в babel.config.js и все заработало. Может кому нибудь поможет 😂

https://stackoverflow.com/questions/54788809/babel-7-dont-compile-class-es6-which-in-node-modules

Stack Overflow

babel 7 don't compile class ES6 which in node_modules

I have error in IE11 SCRIPT1002: Syntax error (problem with class syntax).
My simple code with 2 lines:

import { struct } from 'superstruct';
console.log('finished');
I wan't that my babel7 comp...

источник

20:21пожаловаться #18

И

Илья in Webpack — русскоговорящее сообщество

Удалил лишнее через val-loader и chunk стал 500кб -> 9 кб - профит!

источник

21:28пожаловаться #19

2020 September 28

Ш

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

ребят, нет случайно ни у кого статьи по миграции с 1 на 4? а то на оф доке есть с 1 на 2 и уже с 2 на 3/4, неохота вхолостую этап делать

источник

05:48пожаловаться #20