@zohodesk/client_build_tool
Version:
A CLI tool to build web applications and client libraries
193 lines (173 loc) • 6.62 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _webpack = require("webpack");
const pluginName = 'prefetch-preload-chunk-plugin';
/**
* NOTE: below functions are useable in webpack 5.79.0 as per day 28 Apr 2023
* Please checkout for future changes
* Here List of functions that take chunkId as Argument and return url without publicPath
* `__webpack_require__.u(chunkId)` - return's JS script urlPath
* `__webpack_require__.miniCssF(chunkId)` - return's CSS script urlPath
* `__webpack_require__.miniI18nF(chunkId)` - return's I18N script urlPath
*
*
* if url has .undefined. then chunk or url not valid or that file nt available
*/
class ResourceHintsPlugin {
constructor({
publicPath,
resourceHints
}) {
this.resourceHints = resourceHints;
this.allowPrefetchingMultipleChunks = resourceHints.allowPrefetchingMultipleChunks;
this.publicPathsTemplateObj = {
js: publicPath,
css: publicPath,
i18n: publicPath
};
} // eslint-disable-next-line class-methods-use-this
apply(compiler) {
compiler.hooks.thisCompilation.tap(pluginName, compilation => {
const enabledChunks = new WeakSet();
const handler = (entryRuntimeChunk, set) => {
if (enabledChunks.has(entryRuntimeChunk)) {
return;
}
enabledChunks.add(entryRuntimeChunk);
set.add(_webpack.RuntimeGlobals.getFullHash); // set.add(RuntimeGlobals.getChunkCssFilename);
const {
publicPathsTemplateObj
} = this;
compilation.addRuntimeModule(entryRuntimeChunk, // eslint-disable-next-line no-use-before-define
new ResourceHintsRuntimePlugin(compiler, {
chunk: entryRuntimeChunk,
allowPrefetchingMultipleChunks: this.allowPrefetchingMultipleChunks,
publicPathsTemplateObj
}));
};
compilation.hooks.runtimeRequirementInTree.for(_webpack.RuntimeGlobals.ensureChunkHandlers).tap(pluginName, handler);
});
}
}
exports.default = ResourceHintsPlugin;
class ResourceHintsRuntimePlugin extends _webpack.RuntimeModule {
constructor(compiler, {
chunk,
publicPathsTemplateObj,
allowPrefetchingMultipleChunks
}) {
super('ResourceHintsRuntimePlugin loading', 10);
this.compiler = compiler;
this.publicPathsTemplateObj = publicPathsTemplateObj;
this.allowPrefetchingMultipleChunks = allowPrefetchingMultipleChunks;
this.chunk = chunk;
}
generate() {
const {
chunk
} = this;
const idNameMap = chunk.getChunkMaps().name;
const nameIdMap = {};
let needsMap = this.allowPrefetchingMultipleChunks;
Object.keys(idNameMap).forEach(key => {
const value = idNameMap[key];
nameIdMap[value] = key;
if (key !== value) {
needsMap = true;
}
});
let {
js: jsPP,
css: cssPP,
i18n: i18nPP
} = this.publicPathsTemplateObj;
jsPP = jsPP || _webpack.RuntimeGlobals.publicPath;
cssPP = cssPP || _webpack.RuntimeGlobals.publicPath;
i18nPP = i18nPP || _webpack.RuntimeGlobals.publicPath;
/**
* naming abbr
* ntc -> nameToChunkIdMap
* cns -> chunkNames
* clt -> createLinkTag
* lpp -> loadAsPreloadOrPrefetch
*/
return _webpack.Template.asString([`const ntc = ${JSON.stringify(needsMap ? nameIdMap : {})};
const cns = Object.keys(ntc);
function clt(href, rel) {
let link = document.createElement("link");
link.href = href;
link.rel = rel;
__webpack_require__.nc && link.setAttribute("nonce", __webpack_require__.nc)
if(href.endsWith(".css")) {
link.as="style";
} else if (href.endsWith(".js")) {
link.as="script";
}
document.head.appendChild(link);
}
function isValidUrl(url) {
//return !url.includes(".undefined.");
return url.indexOf(".undefined") === -1;
}
function lpp(_chunkId, rel) {
let chunkId = ${_webpack.RuntimeGlobals.require}.getChunkId(_chunkId);
// ${_webpack.RuntimeGlobals.require}.e(chunkId);
if(__webpack_require__.O.j(chunkId)) {
return;
}
const jsUrl = ${jsPP} + __webpack_require__.u(chunkId);
const cssUrl = ${cssPP} + __webpack_require__.miniCssF(chunkId);
isValidUrl(jsUrl) && clt(jsUrl, rel);
isValidUrl(cssUrl) && clt(cssUrl, rel);
if(__webpack_require__.miniI18nF) {
const i18nUrl = ${i18nPP} + __webpack_require__.miniI18nF(chunkId);
isValidUrl(i18nUrl) && clt(i18nUrl, rel);
}
}
${_webpack.RuntimeGlobals.require}.getChunkId = function getChunkId(chunkId) {
${needsMap ? 'chunkId = ntc[chunkId]||chunkId;' : ''}
return chunkId;
}
${_webpack.RuntimeGlobals.require}.getChunkIds = function getChunkIds(chunkId) {
${// eslint-disable-next-line no-nested-ternary
this.allowPrefetchingMultipleChunks ? `
const isRegExAsChunkId = chunkId instanceof RegExp;
if(isRegExAsChunkId) {
return cns.filter(chunkName => chunkId.test(chunkName)).map(chunkName => ntc[chunkName]);
}
return [${_webpack.RuntimeGlobals.require}.getChunkId(chunkId)];
` : `return [${_webpack.RuntimeGlobals.require}.getChunkId(chunkId)];`}
}
// Prefetch a chunk (${pluginName})
${_webpack.RuntimeGlobals.require}.pfc = function prefetchChunk(chunkId) {
${`
let chunkIds = ${_webpack.RuntimeGlobals.require}.getChunkIds(chunkId);
chunkIds.forEach(idOfAChunk => {
${_webpack.RuntimeGlobals.require}.e(idOfAChunk);
})`}
};
// Preload a chunk (${pluginName})
${_webpack.RuntimeGlobals.require}.plc = function preloadChunk(chunkId) {
let idOfAChunk = ${_webpack.RuntimeGlobals.require}.getChunkIds(chunkId)[0];
lpp(idOfAChunk, "preload");
}
` // `// Prefetch a chunk (${pluginName})`,
// `${RuntimeGlobals.require}.pfc = function prefetchChunk(chunkId) {`,
// Template.indent([
// `chunkId = ${RuntimeGlobals.require}.getChunkId(chunkId)`,
// `${RuntimeGlobals.require}.e(chunkId);`
// ]),
// '};',
// `// Preload a chunk (${pluginName})`,
// `${RuntimeGlobals.require}.pfc = function prefetchChunk(chunkId) {`,
// Template.indent([
// `chunkId = ${RuntimeGlobals.require}.getChunkId(chunkId)`,
// `${RuntimeGlobals.require}.e(chunkId);`
// ]),
// '};'
]);
}
}