Description
Hi, I'm maintaining webpack-subresource-integrity and I'd like to help make the two plugins work together, to ensure integrity for injected link rel="stylesheet"
tags.
For this there would need to be a way for our plugin to add attributes (integrity
and crossorigin
) somewhere around here.
One approach could be a hook that receives an object with the tag name and all attributes. rel
and href
would be needed by our plugin, but I guess for completeness it should also include onload
and onerror
. It would return an object with the same structure. The code would then look something like this:
let tag = {
tagName: 'link',
attributes: {
rel: '"stylesheet"',
onload: 'resolve',
onerror: 'reject',
href: `${mainTemplate.requireFn}.p + ${linkHrefPath}`,
}
};
// up for debate where this hook would be declared, what name to use,
// how to handle backward compatibility etc.
if (compilation.hooks.mutateInjectedTag) {
tag = compilation.hooks.mutateInjectedTag.call(tag);
}
Template.indent([
`var el = document.createElement(${JSON.stringify(tag.tagName)})`
].concat(Object.entries(tag.attributes).map(([name, value]) => (
`el[${JSON.stringify(name)}] = ${value}`
))).concat([
"...",
]);
This aims to be generic, so that it could be used for other plugins that inject tags or that want to modify injected tags.
It's just a suggestion of course, there are other approaches that would also work. But first, what do you think of the general idea, would you accept a PR for this?