Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Select an option

  • Save gabriel-laet/8ec01741efb988f68c458c92c22da2fb to your computer and use it in GitHub Desktop.

Select an option

Save gabriel-laet/8ec01741efb988f68c458c92c22da2fb to your computer and use it in GitHub Desktop.
POC: Babel plugin that automatically adds webpack's magic comment containing chunk name for dynamic imports
/*
Looks for dynamic imports and adds a comment
containing webpack's magic comment syntax
https://webpack.js.org/guides/code-splitting-async/#chunk-names
*/
const {basename} = require('path');
const TYPE_IMPORT = 'Import';
const WEBPACK_CHUNK_NAME = 'webpackChunkName';
module.exports = function () {
return {
visitor: {
StringLiteral: (path) => {
if (path.parent && path.parent.callee && path.parent.callee.type === TYPE_IMPORT) {
const comments = path.node.leadingComments;
if (!comments || !comments.find(c => c.value.indexOf(WEBPACK_CHUNK_NAME) > -1)) {
const chunkName = basename(path.node.value);
path.addComment('leading', `${WEBPACK_CHUNK_NAME}: "${chunkName}"`);
}
}
}
}
};
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment