Pull to refresh

Comments 26

Webpack — это круто. Но! С выходом 4-ой версии появились вопросы как раз по чанкам. Может быть кто ответит как сделать так, чтобы было хорошо, вот в такой ситуации?
У нас есть несколько точек входа: app1.ts, app2.ts, app3.ts и куча модулей. Часть их них из npm, часть свои.
При сборке с опцией optimization.splitChunks.chunks = 'all' получаем огромное количество чанков.
Внимание вопрос: как мне узнать какие из чанков надо добавлять на страницу app1.html, какие на страницу app2.html и app3.html соответственно? Интересующая информация есть в output'е самого webpack'а, но она мне нужна в момент формирования тела страницы сервером (.net). А где ее взять? Может есть какой плагин, который сохранит нужный список чанков (js+css) для каждой точки входа?
так чанки же грузятся автоматически из точек входа

У меня не грузились. Но хорошо если так должно быть, значит это у меня что-то не то в конфиге.
Тогда задам вопрос по другому: Значит ли это что указав в теге script только точку входа, все остальное загрузится само?

Все таки не грузятся. Массив deferredModules заполняется и сам никогда не читается. Базовый код webpackBootstrap не содержит в себе кода для подгрузки deferredModules.
Если не прав — ткните пальцем. Буду только рад.


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


Следующий код, вставленный в конец страницы, загружает все необходимое (почему это делаю я, а не webpack?)


<script type="text/javascript">
        let modules = window["webpackJsonp"] || [];
        for (let module of modules) {
            let [, , dependencies] = module;
            for (let dependency of dependencies) {
                for (let t = 2; t < dependency.length; t++) {
                    const script = document.createElement("script");
                    script.src = "/public/" + dependency[t] + ".js";
                    document.head.appendChild(script);
                }
            }
        }
</script>

Остается не закрытый вопрос с CSS. Если воспользоваться extract-text-webpack-plugin (который все еще в стадии beta для webpack4), то не ясно как его грузить. Тем более что для CSS порядок загрузки важен.

Вот такой же вопрос возник, когда читал статью. Вот выплюнет он несколько десятков (или даже сотен) js файлов, и как их потом подключать? И которые из них нужно или не нужно подключать? У нас 4 бандла: meta (вроде, точно не помню), vendor, admin и main. Но что из этого подключать мы знаем. А в его варианте?
Так используйте просто динамический импорт. Вебпак сам все подгрузит.
Так а есть ли причины css делать через webpack+extract-text-webpack-plugin для последующей загрузки через `link rel=«stylesheet»` (а для чего еще — может я чего не знаю)? Ну кроме «мне так удобно»? Может как-то еще можно через webpack в run time этот css прогонять и какая-то появляется «дополнительная ценность» которой я не вижу…

Css должны быть загружены до того, как загрузился js. В противном случае возможна ситуация, когда при открытии страницы вы видите некоторое время кашу.

ОК (никакой runtime магии webpackа). Каша это серьезная причина грузить через `link rel=«stylesheet»`, а в чем причина делать сss (да еще и чанками) через вебпак а не скажем клеить как хочешь gulp'ом? Вот зачем пихать css в трубу webpackа а потом вытаскивать плагинами если это ничего не добавляет в дев тайм? Или добавляет?
Потому что нам нужна не только «склейка» css, но и некоторая пост-обработка. К тому же рядом с webpack есть webpack-dev-server, который позволяет делать магию hot-reload.

А от gulp мы ушли, т.к. он стал мешать.
это очень хитрая потстобработка которой необходим вебпка? post-css тоже ведь можно из gulp вызвать.
webpack-dev-server делает hot reload `link rel=«stylesheet»`?

Да. Очень хитрая. Для webpack'а css это модуль (для него все есть модуль) в котором могут быть ссылки на другие модули (картинки, шрифты). Эти же модули можно использовать в ts/js.


Например, можно писать так:


div.picture{
  background-image: src('./images/picture.jpg');
}

и так:


import picture from "./images/picture.jpg";
document.createElement("img").src = picture;

Webpack поймет что это (picture.jpg) один и тот же модуль. Магия может быть применена и к картинке в том числе. Например, файл может быть заменен base64, если он очень маленький. И это будет прозрачно для js и css.

а чем вы заменили img src? (я действительно заинтересован вытянуть опыт, тут нет подколов).

проблемам посвещен вся вот эта записись и блог habr.com/post/423693. вы их решили — наверное молодцы. Но вы же их и создали (так что те кто на это всё посмотрят и не пойдут — тоже наверное молодцы).
Расскажите может сюда vitaliy@leschenko.by в чем ваша проблема. Если смогу помогу.
спасибо. да я просто тогда в PM раз вы как считаете вопрос чем заменить img src при создании html/razor оффтопом здесь.
Смотрел. Не то. Этот плагин говорит где будет лежать файл имя которого я знаю (по исходникам). Но он ничего не говорит о зависимостях.

В процессе сборки webpack пишет в консоль:
много всего
Entrypoint site-custompage-view = runtime.js?f9cd204313fcc36935c6 runtime.js.map?f9cd204313fcc36935c6 vendors~admin-pages~admin-posts~profile-filestorage~profile-manage-authenticator~profile-posts~site-~3a451633.js?a94efb6d35554e8d159d vendors~admin-pages~admin-posts~profile-filestorage~profile-manage-authenticator~profile-posts~site-~3a451633.js.map?a94efb6d35554e8d159d vendors~admin-pages~admin-posts~profile-manage-authenticator~profile-posts~site-common~site-custompa~cf03b557.js?e3d572d8ec6a9d2d8786 vendors~admin-pages~admin-posts~profile-manage-authenticator~profile-posts~site-common~site-custompa~cf03b557.js.map?e3d572d8ec6a9d2d8786 site-custompage-view.js?2c9e3ea4ee8bc8e96fe6 site-custompage-view.js.map?2c9e3ea4ee8bc8e96fe6
Entrypoint site-page-view = runtime.js?f9cd204313fcc36935c6 runtime.js.map?f9cd204313fcc36935c6 vendors~admin-pages~admin-posts~profile-filestorage~profile-manage-authenticator~profile-posts~site-~3a451633.js?a94efb6d35554e8d159d vendors~admin-pages~admin-posts~profile-filestorage~profile-manage-authenticator~profile-posts~site-~3a451633.js.map?a94efb6d35554e8d159d vendors~admin-pages~admin-posts~profile-manage-authenticator~profile-posts~site-common~site-custompa~cf03b557.js?e3d572d8ec6a9d2d8786 vendors~admin-pages~admin-posts~profile-manage-authenticator~profile-posts~site-common~site-custompa~cf03b557.js.map?e3d572d8ec6a9d2d8786 vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-page-view~site-post-view.js?751fd19d1df6f81e67a2 vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-page-view~site-post-view.js.map?751fd19d1df6f81e67a2 site-page-view.js?be8a2a44c217161efcfc site-page-view.js.map?be8a2a44c217161efcfc
Entrypoint site-post-view = runtime.js?f9cd204313fcc36935c6 runtime.js.map?f9cd204313fcc36935c6 vendors~admin-pages~admin-posts~profile-filestorage~profile-manage-authenticator~profile-posts~site-~3a451633.js?a94efb6d35554e8d159d vendors~admin-pages~admin-posts~profile-filestorage~profile-manage-authenticator~profile-posts~site-~3a451633.js.map?a94efb6d35554e8d159d vendors~admin-pages~admin-posts~profile-manage-authenticator~profile-posts~site-common~site-custompa~cf03b557.js?e3d572d8ec6a9d2d8786 vendors~admin-pages~admin-posts~profile-manage-authenticator~profile-posts~site-common~site-custompa~cf03b557.js.map?e3d572d8ec6a9d2d8786 vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-page-view~site-post-view.js?751fd19d1df6f81e67a2 vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-page-view~site-post-view.js.map?751fd19d1df6f81e67a2 vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-post-view.js?c129b4d28fd029014b5d vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-post-view.js.map?c129b4d28fd029014b5d vendors~admin-pages~admin-posts~profile-posts~site-common~site-post-view.js?41bdadb1b1aef7fb7442 vendors~admin-pages~admin-posts~profile-posts~site-common~site-post-view.js.map?41bdadb1b1aef7fb7442 vendors~admin-pages~admin-posts~profile-posts~site-post-view.js?57e14dc4e77f560ad7c3 vendors~admin-pages~admin-posts~profile-posts~site-post-view.js.map?57e14dc4e77f560ad7c3 vendors~admin-posts~profile-posts~site-common~site-post-view.js?3f714864320cc42bc538 vendors~admin-posts~profile-posts~site-common~site-post-view.js.map?3f714864320cc42bc538 admin-pages~admin-posts~profile-posts~site-common~site-post-view.js?1de9d2f3dd37c79fa4d0 admin-pages~admin-posts~profile-posts~site-common~site-post-view.css?1de9d2f3dd37c79fa4d0 admin-pages~admin-posts~profile-posts~site-common~site-post-view.js.map?1de9d2f3dd37c79fa4d0 admin-pages~admin-posts~profile-posts~site-common~site-post-view.css.map?1de9d2f3dd37c79fa4d0 admin-pages~admin-posts~profile-filestorage~profile-posts~site-post-view.js?2245624565e3fff297f0 admin-pages~admin-posts~profile-filestorage~profile-posts~site-post-view.js.map?2245624565e3fff297f0 admin-posts~site-post-view.js?da420a76849dabea6ce6 admin-posts~site-post-view.css?da420a76849dabea6ce6 admin-posts~site-post-view.js.map?da420a76849dabea6ce6 admin-posts~site-post-view.css.map?da420a76849dabea6ce6 site-post-view.js?77547b7ea939e0f5340c site-post-view.js.map?77547b7ea939e0f5340c
Entrypoint site-common = runtime.js?f9cd204313fcc36935c6 runtime.js.map?f9cd204313fcc36935c6 vendors~admin-pages~admin-posts~profile-filestorage~profile-manage-authenticator~profile-posts~site-~3a451633.js?a94efb6d35554e8d159d vendors~admin-pages~admin-posts~profile-filestorage~profile-manage-authenticator~profile-posts~site-~3a451633.js.map?a94efb6d35554e8d159d vendors~admin-pages~admin-posts~profile-manage-authenticator~profile-posts~site-common~site-custompa~cf03b557.js?e3d572d8ec6a9d2d8786 vendors~admin-pages~admin-posts~profile-manage-authenticator~profile-posts~site-common~site-custompa~cf03b557.js.map?e3d572d8ec6a9d2d8786 vendors~admin-pages~admin-posts~profile-posts~site-common~site-post-view.js?41bdadb1b1aef7fb7442 vendors~admin-pages~admin-posts~profile-posts~site-common~site-post-view.js.map?41bdadb1b1aef7fb7442 vendors~admin-posts~profile-posts~site-common~site-post-view.js?3f714864320cc42bc538 vendors~admin-posts~profile-posts~site-common~site-post-view.js.map?3f714864320cc42bc538 vendors~site-common.js?9faf27b3baae39f343e8 vendors~site-common.js.map?9faf27b3baae39f343e8 admin-pages~admin-posts~profile-posts~site-common~site-post-view.js?1de9d2f3dd37c79fa4d0 admin-pages~admin-posts~profile-posts~site-common~site-post-view.css?1de9d2f3dd37c79fa4d0 admin-pages~admin-posts~profile-posts~site-common~site-post-view.js.map?1de9d2f3dd37c79fa4d0 admin-pages~admin-posts~profile-posts~site-common~site-post-view.css.map?1de9d2f3dd37c79fa4d0 site-common.js?7989aa18b26d9f337922 site-common.css?7989aa18b26d9f337922 site-common.js.map?7989aa18b26d9f337922 site-common.css.map?7989aa18b26d9f337922
Entrypoint profile-manage-authenticator = runtime.js?f9cd204313fcc36935c6 runtime.js.map?f9cd204313fcc36935c6 vendors~admin-pages~admin-posts~profile-filestorage~profile-manage-authenticator~profile-posts~site-~3a451633.js?a94efb6d35554e8d159d vendors~admin-pages~admin-posts~profile-filestorage~profile-manage-authenticator~profile-posts~site-~3a451633.js.map?a94efb6d35554e8d159d vendors~admin-pages~admin-posts~profile-manage-authenticator~profile-posts~site-common~site-custompa~cf03b557.js?e3d572d8ec6a9d2d8786 vendors~admin-pages~admin-posts~profile-manage-authenticator~profile-posts~site-common~site-custompa~cf03b557.js.map?e3d572d8ec6a9d2d8786 profile-manage-authenticator.js?5681b00d8f196819264e profile-manage-authenticator.js.map?5681b00d8f196819264e
Entrypoint profile-filestorage = runtime.js?f9cd204313fcc36935c6 runtime.js.map?f9cd204313fcc36935c6 vendors~admin-pages~admin-posts~profile-filestorage~profile-manage-authenticator~profile-posts~site-~3a451633.js?a94efb6d35554e8d159d vendors~admin-pages~admin-posts~profile-filestorage~profile-manage-authenticator~profile-posts~site-~3a451633.js.map?a94efb6d35554e8d159d vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-page-view~site-post-view.js?751fd19d1df6f81e67a2 vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-page-view~site-post-view.js.map?751fd19d1df6f81e67a2 vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-post-view.js?c129b4d28fd029014b5d vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-post-view.js.map?c129b4d28fd029014b5d admin-pages~admin-posts~profile-filestorage~profile-posts~site-post-view.js?2245624565e3fff297f0 admin-pages~admin-posts~profile-filestorage~profile-posts~site-post-view.js.map?2245624565e3fff297f0 profile-filestorage.js?25c836f2869fc1274fa0 profile-filestorage.css?25c836f2869fc1274fa0 profile-filestorage.js.map?25c836f2869fc1274fa0 profile-filestorage.css.map?25c836f2869fc1274fa0
Entrypoint profile-posts = runtime.js?f9cd204313fcc36935c6 runtime.js.map?f9cd204313fcc36935c6 vendors~admin-pages~admin-posts~profile-filestorage~profile-manage-authenticator~profile-posts~site-~3a451633.js?a94efb6d35554e8d159d vendors~admin-pages~admin-posts~profile-filestorage~profile-manage-authenticator~profile-posts~site-~3a451633.js.map?a94efb6d35554e8d159d vendors~admin-pages~admin-posts~profile-manage-authenticator~profile-posts~site-common~site-custompa~cf03b557.js?e3d572d8ec6a9d2d8786 vendors~admin-pages~admin-posts~profile-manage-authenticator~profile-posts~site-common~site-custompa~cf03b557.js.map?e3d572d8ec6a9d2d8786 vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-page-view~site-post-view.js?751fd19d1df6f81e67a2 vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-page-view~site-post-view.js.map?751fd19d1df6f81e67a2 vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-post-view.js?c129b4d28fd029014b5d vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-post-view.js.map?c129b4d28fd029014b5d vendors~admin-pages~admin-posts~profile-posts~site-common~site-post-view.js?41bdadb1b1aef7fb7442 vendors~admin-pages~admin-posts~profile-posts~site-common~site-post-view.js.map?41bdadb1b1aef7fb7442 vendors~admin-pages~admin-posts~profile-posts~site-post-view.js?57e14dc4e77f560ad7c3 vendors~admin-pages~admin-posts~profile-posts~site-post-view.js.map?57e14dc4e77f560ad7c3 vendors~admin-posts~profile-posts~site-common~site-post-view.js?3f714864320cc42bc538 vendors~admin-posts~profile-posts~site-common~site-post-view.js.map?3f714864320cc42bc538 admin-pages~admin-posts~profile-posts~site-common~site-post-view.js?1de9d2f3dd37c79fa4d0 admin-pages~admin-posts~profile-posts~site-common~site-post-view.css?1de9d2f3dd37c79fa4d0 admin-pages~admin-posts~profile-posts~site-common~site-post-view.js.map?1de9d2f3dd37c79fa4d0 admin-pages~admin-posts~profile-posts~site-common~site-post-view.css.map?1de9d2f3dd37c79fa4d0 admin-pages~admin-posts~profile-filestorage~profile-posts~site-post-view.js?2245624565e3fff297f0 admin-pages~admin-posts~profile-filestorage~profile-posts~site-post-view.js.map?2245624565e3fff297f0 admin-pages~admin-posts~profile-posts.js?8f61e4a5e7732c12614d admin-pages~admin-posts~profile-posts.js.map?8f61e4a5e7732c12614d profile-posts.js?50cea853c3913a6c9592 profile-posts.css?50cea853c3913a6c9592 profile-posts.js.map?50cea853c3913a6c9592 profile-posts.css.map?50cea853c3913a6c9592
Entrypoint admin-pages = runtime.js?f9cd204313fcc36935c6 runtime.js.map?f9cd204313fcc36935c6 vendors~admin-pages~admin-posts~profile-filestorage~profile-manage-authenticator~profile-posts~site-~3a451633.js?a94efb6d35554e8d159d vendors~admin-pages~admin-posts~profile-filestorage~profile-manage-authenticator~profile-posts~site-~3a451633.js.map?a94efb6d35554e8d159d vendors~admin-pages~admin-posts~profile-manage-authenticator~profile-posts~site-common~site-custompa~cf03b557.js?e3d572d8ec6a9d2d8786 vendors~admin-pages~admin-posts~profile-manage-authenticator~profile-posts~site-common~site-custompa~cf03b557.js.map?e3d572d8ec6a9d2d8786 vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-page-view~site-post-view.js?751fd19d1df6f81e67a2 vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-page-view~site-post-view.js.map?751fd19d1df6f81e67a2 vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-post-view.js?c129b4d28fd029014b5d vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-post-view.js.map?c129b4d28fd029014b5d vendors~admin-pages~admin-posts~profile-posts~site-common~site-post-view.js?41bdadb1b1aef7fb7442 vendors~admin-pages~admin-posts~profile-posts~site-common~site-post-view.js.map?41bdadb1b1aef7fb7442 vendors~admin-pages~admin-posts~profile-posts~site-post-view.js?57e14dc4e77f560ad7c3 vendors~admin-pages~admin-posts~profile-posts~site-post-view.js.map?57e14dc4e77f560ad7c3 admin-pages~admin-posts~profile-posts~site-common~site-post-view.js?1de9d2f3dd37c79fa4d0 admin-pages~admin-posts~profile-posts~site-common~site-post-view.css?1de9d2f3dd37c79fa4d0 admin-pages~admin-posts~profile-posts~site-common~site-post-view.js.map?1de9d2f3dd37c79fa4d0 admin-pages~admin-posts~profile-posts~site-common~site-post-view.css.map?1de9d2f3dd37c79fa4d0 admin-pages~admin-posts~profile-filestorage~profile-posts~site-post-view.js?2245624565e3fff297f0 admin-pages~admin-posts~profile-filestorage~profile-posts~site-post-view.js.map?2245624565e3fff297f0 admin-pages~admin-posts~profile-posts.js?8f61e4a5e7732c12614d admin-pages~admin-posts~profile-posts.js.map?8f61e4a5e7732c12614d admin-pages.js?9fed5a72a0b2256c01c9 admin-pages.css?9fed5a72a0b2256c01c9 admin-pages.js.map?9fed5a72a0b2256c01c9 admin-pages.css.map?9fed5a72a0b2256c01c9
Entrypoint admin-posts = runtime.js?f9cd204313fcc36935c6 runtime.js.map?f9cd204313fcc36935c6 vendors~admin-pages~admin-posts~profile-filestorage~profile-manage-authenticator~profile-posts~site-~3a451633.js?a94efb6d35554e8d159d vendors~admin-pages~admin-posts~profile-filestorage~profile-manage-authenticator~profile-posts~site-~3a451633.js.map?a94efb6d35554e8d159d vendors~admin-pages~admin-posts~profile-manage-authenticator~profile-posts~site-common~site-custompa~cf03b557.js?e3d572d8ec6a9d2d8786 vendors~admin-pages~admin-posts~profile-manage-authenticator~profile-posts~site-common~site-custompa~cf03b557.js.map?e3d572d8ec6a9d2d8786 vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-page-view~site-post-view.js?751fd19d1df6f81e67a2 vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-page-view~site-post-view.js.map?751fd19d1df6f81e67a2 vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-post-view.js?c129b4d28fd029014b5d vendors~admin-pages~admin-posts~profile-filestorage~profile-posts~site-post-view.js.map?c129b4d28fd029014b5d vendors~admin-pages~admin-posts~profile-posts~site-common~site-post-view.js?41bdadb1b1aef7fb7442 vendors~admin-pages~admin-posts~profile-posts~site-common~site-post-view.js.map?41bdadb1b1aef7fb7442 vendors~admin-pages~admin-posts~profile-posts~site-post-view.js?57e14dc4e77f560ad7c3 vendors~admin-pages~admin-posts~profile-posts~site-post-view.js.map?57e14dc4e77f560ad7c3 vendors~admin-posts~profile-posts~site-common~site-post-view.js?3f714864320cc42bc538 vendors~admin-posts~profile-posts~site-common~site-post-view.js.map?3f714864320cc42bc538 admin-pages~admin-posts~profile-posts~site-common~site-post-view.js?1de9d2f3dd37c79fa4d0 admin-pages~admin-posts~profile-posts~site-common~site-post-view.css?1de9d2f3dd37c79fa4d0 admin-pages~admin-posts~profile-posts~site-common~site-post-view.js.map?1de9d2f3dd37c79fa4d0 admin-pages~admin-posts~profile-posts~site-common~site-post-view.css.map?1de9d2f3dd37c79fa4d0 admin-pages~admin-posts~profile-filestorage~profile-posts~site-post-view.js?2245624565e3fff297f0 admin-pages~admin-posts~profile-filestorage~profile-posts~site-post-view.js.map?2245624565e3fff297f0 admin-pages~admin-posts~profile-posts.js?8f61e4a5e7732c12614d admin-pages~admin-posts~profile-posts.js.map?8f61e4a5e7732c12614d admin-posts~site-post-view.js?da420a76849dabea6ce6 admin-posts~site-post-view.css?da420a76849dabea6ce6 admin-posts~site-post-view.js.map?da420a76849dabea6ce6 admin-posts~site-post-view.css.map?da420a76849dabea6ce6 admin-posts.js?07ddd1170568a8892fe6 admin-posts.css?07ddd1170568a8892fe6 admin-posts.js.map?07ddd1170568a8892fe6 admin-posts.css.map?07ddd1170568a8892fe6


Здесь для каждой точки входа набор необходимых файлов. Но я понятия не имею как этот выхлоп сохранить куда-то. assets-webpack-plugin может по имени файла сказать как он будет выглядеть с хешем и где он лежит, но мне надо не 1 файл, а список для каждой точки входа.
Сейчас как раз стою перед такой же проблемой. Если я вас правильно понял, то в репах webpack как раз описана данная ситуация (github), но не описывается как можно вытащить манифест с привязкой к точкам входа. В таком случае догрузки нужных файлов в рантайме действительно не происходит. Я планировал использовать динамические импорты (вот тут есть хороший пример для понимания), или вот это плугин (webpack-assets-manifest) основываясь на данном issue.
Основная причина разделения, в том что Алиса может ходит по нашему сайту, и всего один файл будет грузиться для второй и последующих страниц каждого вида (в первый — два). Тут мы получаем ускорение загрузки. Плюс мы получаем ускорение за счет прекомпиляции частоиспользуемого кода общего бандла.

А рассуждения о том как часто Алиса заходит на сайт не учитывают размер кеша в браузере. В firefox он 512 Мб, а в Хроме динамический, но прямо сейчас у меня по умолчанию установлено в 320 Мб.

И если Алиса заходит на другие сайты в интернете, то получается что в день она весь свой кеш полностью обновит.
«хотя, надо отметить, мы не говорили тут о CSS»
в оригинале «Dammit I forgot to mention CSS» — нахальная отмазка халтурщика — хотя и понятно что вопрос сложный.

Во-первых, так надо или нет css по трубе sass/postcss прогонять через webpack и зачем? Кто что решил? Во-вторых, ну и как его чанками (вендор, не вендор) создавать?
Только что ответил в смысле «незачем так мучатся» — «mini-css-extract-plugin» это просто хак, не надо его насиловать…

stackoverflow.com/questions/52202194/webpack-4-splitchunks-generating-multiple-css/52376383#52376383 (если понимать ситуацию как конкретную)

и тут…

github.com/faceyspacey/extract-css-chunks-webpack-plugin

Это незакончится никогда.
Only those users with full accounts are able to leave comments. Log in, please.