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

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

Спасибо, кажется hmr + browsersync тяжелая связка

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

при ридекрете со стороны пхп - browserSync вывозит ситуацию и оста1тся там же на localhost'e, webpack-dev-server редиректит на реальную пейджу, тащить ради этого целого слона, придётся копать кишки brwosersync и учить dev-server оставаться там же после редиректа, если у кого был подобный experience, буду очень рад!

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

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

Народ, спасите! Мне нужен был конфиг вебпака, создал в сторонке create-react-app, сделал ему eject, забрал себе папку config. Пытаюсь билдить bundle но вылазят ошибки с 1000 и 1 зависимостей, а какие из них реально нужны, и как можно удалить не понятно.
Вопрос: как это быстро решается? Не может быть чтобы все так мучались с конфигом вебпака

23:16пожаловаться

2019 April 12

Товарищи, в каких случаях может не подхватываться hot-reload, в консоле обычно нечто в виде *hmr: connected*, webpack + webpack+webpack-browser-sync, файлы сервятся, прокси работает, но страница не обновляется при изменениях, самую первую версию бандла подсосало и все, на изменения не реагирует, плагин и hot проставил, как это вообще отдебажить? Проблема в publicPath?

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

BrowserSync проксирует dev-server, а dev-server настроен с прокси на стенд и hot-reload, в результате все все сервят и проксируют, но без hot'a, пробовал и без BrowserSync, аналогичная картина, но при авторизации на странице пхп редиректит на реальную страницу вместо localhost (c browsersync проблема исчезает), около хожу

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

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

День добрый!
Есть собственная библиотека, которая собирается в dist/[имя_модуля]

В других проектах импортируется так:

import Foo from "my.module/dist/Foo";

Хочется:

import Foo from "my.module/Foo";

Если реализуемо , то в какую сторону смотреть?

Дмитрий Скрыльников in Webpack — русскоговорящее сообщество

14:32пожаловаться

ДС

https://docs.npmjs.com/files/package.json#main

import Foo from "my.module/dist/Foo";

Хочется:

import Foo from "my.module/Foo";

Если реализуемо , то в какую сторону смотреть?

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

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

Дмитрий Скрыльников

https://docs.npmjs.com/files/package.json#main

речь о другом, в папке dist множество модулей(dist/[foo,bar,baz].js), а испортировать требуется по отдельности
Сейчас чтобы импортировать такой модуль необходимо указать полный путь "my.module/dist/FileName", хочется зарезолвить до "my.module/FileName"

Дмитрий Скрыльников in Webpack — русскоговорящее сообщество

14:54пожаловаться

ДС

А если там папку dist указать?

Дмитрий Скрыльников in Webpack — русскоговорящее сообщество

14:54пожаловаться

ДС

Ещё можно деплоить на npm содержимое папки dist сразу

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

14:54пожаловаться

Дмитрий Скрыльников

Ещё можно деплоить на npm содержимое папки dist сразу

Именно так и делается. Вопрос об исключении из путя dist
import Foo from "my.module/dist/Foo";
==>
import Foo from "my.module/Foo";

Дмитрий Скрыльников in Webpack — русскоговорящее сообщество

14:57пожаловаться

ДС

Именно так и делается. Вопрос об исключении из путя dist
import Foo from "my.module/dist/Foo";
==>
import Foo from "my.module/Foo";

Нет делается не так. Можно скопировать всё что нужно в папку dist, перейти туда и выполнить там npm publish

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

14:58пожаловаться

Скорее всего только костылями

у lodash все файлы тупо в корне в исходниках, react-use не парится и предлагает подключать отдельные функции как import useToggle from 'react-use/lib/useToggle'

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

15:05пожаловаться

или как-то извернуться, в main-файле пакета сделать

import Foo from './dist/Foo';
import Boo from './dist/Boo';

export Foo;
export Boo;

export default {
    Foo,
    Boo,
}

и потом

import library, { Boo } from './someLibrary'

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

15:09пожаловаться

Anton Karmanov

или как-то извернуться, в main-файле пакета сделать

import Foo from './dist/Foo';
import Boo from './dist/Boo';

export Foo;
export Boo;

export default {
    Foo,
    Boo,
}

и потом

import library, { Boo } from './someLibrary'

да, тоже смотрел на lodash, подход совсем не понравился
В предложенном варианте скорей всего получится так, что при импорте Foo/Bar в main.js в проект потянется все модули

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

15:20пожаловаться

Ребят, поделитесь опытом. Как отделяете одни вендор чанки от других?
Сейчас отделяю регуляркой, есть ли способ поэлегантнее?

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

15:35пожаловаться

all: {
test: /[\\/]node_modules[\\/](?!lodash[\\/])/,
name: 'libs',
chunks: 'all',
},
lodash: {
test: /[\\/]node_modules[\\/]lodash[\\/]/,
name: 'lodash',
chunks: 'all',

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

15:35пожаловаться

Sergey

all: {
test: /[\\/]node_modules[\\/](?!lodash[\\/])/,
name: 'libs',
chunks: 'all',
},
lodash: {
test: /[\\/]node_modules[\\/]lodash[\\/]/,
name: 'lodash',
chunks: 'all',

test может быть функцией

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

15:35пожаловаться

Все оказалось гораздо проще. Решилось через resolve.alias в проекте к которму подключается либа. В моем случае это Vue и выглядит примерно так. Лишний код не тянет. Может будет полезно