Thanks for making this excellent tool.
I have a feature request. Would you consider an option that adds a content hash to the chunk name inserted into the webpackChunkName magic comment?
I want to do this because I have this in my webpack config:
output: {
filename: 'js/[name]_bundle.js',
}
...
loader: "magic-comments-loader",
options: {
verbose: true,
webpackChunkName: {
config: {
basename: true,
//contentHash: true,
}
}
}
And this in my web application
import("../../tt/about_box.html").then(module => { ...
magic-comments-loader automatically inserts
/* webpackChunkName: "about_box" */
for me, but I would like to introduce cache busting.
The easiest way I could think of was to add a content-hash to the chunk name. That is, I would like the loader to read the about_box.html file, generate a truncated MD5 has and add it to the end of the chunk name.
I know I could just add "[contenthash]" to output.filename, but this would change the naming scheme for all assets. I only want to change it for dynamic imports.
I looked at the webpackChunkName options in the loader config but didn't find any option that would allow me to provide a function to generate a custom chunk name during build time.
In the end I modified webpackChunkName.js myself to make a proof of concept.
if (config.contentHash) {
const fileToImport=dirname(filepath)+"/"+importPath;
chunkName=chunkName+"_"+sync(fileToImport).substr(0, 8);;
};
Here sync comes from the md5-file module.
Now it works, and I see this log output at build time:
LOG from ../rohan/magic-comments-loader/src/index.js MCL ../rohan/magic-comments-loader/src/index.js??ruleSet[1].rules[1].use[0]!./node_modules/babel-loader/lib/index.js??ruleSet[1].rules[1].use[1]!./javascripts/app/config_pagesc.js
<i> [MCL] javascripts/app/config_pagesc.js : import(/* webpackChunkName: "about_box_5a4d7295" */ "../../tt/about_box.html")
If you like the idea I can send a PR. For prior art see babel-plugin-add-contenthash-to-imports.