@regru/webpack-babel-multi-target-plugin
Version:
A Webpack plugin that works with Babel to allow deployment of ES2015 builds targeted to modern browsers, with an ES5 fallback for legacy browsers.
78 lines • 3.58 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
const babel_target_1 = require("./babel-target");
const PLUGIN_NAME = 'NamedLazyChunksPlugin';
/**
* Gives names to lazy chunks (lazy routes) so their assets have recognizable names instead of just numbers.
*/
class NamedLazyChunksPlugin {
getNameFromOrigins(chunk) {
const nameInfo = [...chunk.groupsIterable].reduce((result, group) => {
if (!group.origins) {
return;
}
if (group.runtimeChunk === chunk) {
result.origins = [group.runtimeChunk.entryModule.reasons[0].dependencies.originalName];
result.isEntry = true;
}
group.origins.forEach((origin) => {
const isLazyModule = origin.module && origin.module.options && origin.module.options.mode === 'lazy';
const isNgFactory = origin.request && origin.request.match(/\.ngfactory(?:\?babel-target=\w+)?$/);
if (!isLazyModule && !isNgFactory) {
return;
}
if (!result.babelTarget) {
result.babelTarget = babel_target_1.BabelTarget.findTarget(origin.module);
}
if (result.isEntry) {
return;
}
const cleanedName = isNgFactory ?
// remove .ngfactory and babel target tag from request name
origin.request.replace(/\.ngfactory(?:\?babel-target=\w+)?$/, '') :
// remove file extension
origin.request.replace(/\.\w+(?:\?babel-target=\w+)?$/, '');
const nameStart = cleanedName.lastIndexOf('/') + 1;
const originName = cleanedName.substring(nameStart);
if (!result.origins.includes(originName)) {
result.origins.push(originName);
}
});
return result;
}, { origins: [] });
const name = nameInfo.origins.join('~');
return nameInfo.babelTarget.tagAssetsWithKey ? `${name}.${nameInfo.babelTarget.key}` : name;
}
apply(compiler) {
compiler.hooks.compilation.tap(PLUGIN_NAME, (compilation) => {
if (compilation.name) {
return;
}
compilation.hooks.beforeChunkIds.tap(PLUGIN_NAME, (chunks) => {
const usedNames = {};
chunks.forEach(chunk => {
if (chunk.id || chunk.name) {
return;
}
const isVendorsChunk = chunk.chunkReason === 'split chunk (cache group: vendors)';
let name = this.getNameFromOrigins(chunk);
if (isVendorsChunk) {
name = `vendors~` + name;
}
// HACK ALERT: the combination of multiple lazy child routes and chunk splitting can make this
// get pretty hairy. Need to figure out a better way to handle it.
if (typeof (usedNames[name]) === 'undefined') {
usedNames[name] = -1;
}
usedNames[name]++;
if (usedNames[name] > 0) {
name += `.${usedNames[name]}`;
}
chunk.id = name;
});
});
});
}
}
exports.NamedLazyChunksPlugin = NamedLazyChunksPlugin;
//# sourceMappingURL=named.lazy.chunks.plugin.js.map