Формировать более подробный манифест для корректной работы SSR
Opened this issue · 4 comments
amodanov commented
На текущий момент ассет по чанкам выглядит следующим образом
"power-of-attorney-preview-list": {
"js": "assets/power-of-attorney-preview-list.c956602f.chunk.js",
"css": "assets/power-of-attorney-preview-list.b9cecdcc.chunk.css"
},
Хотелось бы видеть более полный список, для подключения этих чанков к html на стороне ssr, чтобы отображать клиенту полностью готовую страницу, без необходимости их дополнительной подгрузки
"power-of-attorney-preview-list": {
"name": "power-of-attorney-preview-list",
"assets": [
{
"name": "615.512981a7.chunk.js"
},
{
"name": "615.ee7fb4af.chunk.css"
},
{
"name": "686.b315abca.chunk.js"
},
{
"name": "686.9c9aafe6.chunk.css"
},
{
"name": "887.fa1e2739.chunk.js"
},
{
"name": "887.b74652de.chunk.css"
},
{
"name": "202.d5795534.chunk.js"
},
{
"name": "202.d8490bb1.chunk.css"
},
{
"name": "435.af55cf7e.chunk.css"
},
{
"name": "632.be6860ac.chunk.js"
},
{
"name": "power-of-attorney-preview-list.c956602f.chunk.js"
},
{
"name": "power-of-attorney-preview-list.b9cecdcc.chunk.css"
}
],
"filteredAssets": 0,
"assetsSize": null,
"filteredAuxiliaryAssets": 7,
"auxiliaryAssetsSize": null
},
Данный пример поставляется следующим плагином webpack-stats-plugin
new StatsWriterPlugin({
fields: null,
stats: {
all: false,
chunkGroups: true,
},
}),
amodanov commented
При использовании метода трансформера удалось добиться более привычного вида для манифеста
new StatsWriterPlugin({
filename: '../webpack-stats.json',
fields: null,
stats: {
all: false,
chunkGroups: true,
},
transform: (stats) => {
const transformedStats = {};
for (let chunkGroup in stats.namedChunkGroups) {
const jsAssets = [];
const cssAssets = [];
stats.namedChunkGroups[chunkGroup].assets.forEach((asset) => {
if (asset.name.endsWith('.js')) {
jsAssets.push(asset.name);
} else if (asset.name.endsWith('.css')) {
cssAssets.push(asset.name);
}
});
transformedStats[chunkGroup] = {
js: jsAssets,
css: cssAssets,
};
};
return JSON.stringify(transformedStats);
},
}),
{
"module-name": {
"js": ["vendor.f85a0327.js", "main.e2184ab8.js"],
"css": ["vendor.4d35befb.css", "main.28de40fe.css"]
},
}