From e46a6b5d6813deaf6e20ee82ec3ffb335400a2c3 Mon Sep 17 00:00:00 2001 From: dhruvdutt Date: Wed, 1 Aug 2018 00:28:32 +0530 Subject: [PATCH] feat(migrate): commonChunksPlugin to SplitChunksPlugin ISSUES CLOSED: #393 --- .../commonsChunkPlugin.test.js.snap | 62 +++++++++ .../__testfixtures__/.editorconfig | 3 + .../commonsChunkPlugin-0.input.js | 8 ++ .../commonsChunkPlugin-1.input.js | 7 ++ .../commonsChunkPlugin-2.input.js | 7 ++ .../commonsChunkPlugin.test.js | 7 ++ .../commonsChunkPlugin/commonsChunkPlugin.ts | 119 ++++++++++++++++++ packages/migrate/migrate.ts | 3 + 8 files changed, 216 insertions(+) create mode 100644 packages/migrate/commonsChunkPlugin/__snapshots__/commonsChunkPlugin.test.js.snap create mode 100644 packages/migrate/commonsChunkPlugin/__testfixtures__/.editorconfig create mode 100644 packages/migrate/commonsChunkPlugin/__testfixtures__/commonsChunkPlugin-0.input.js create mode 100644 packages/migrate/commonsChunkPlugin/__testfixtures__/commonsChunkPlugin-1.input.js create mode 100644 packages/migrate/commonsChunkPlugin/__testfixtures__/commonsChunkPlugin-2.input.js create mode 100644 packages/migrate/commonsChunkPlugin/commonsChunkPlugin.test.js create mode 100644 packages/migrate/commonsChunkPlugin/commonsChunkPlugin.ts diff --git a/packages/migrate/commonsChunkPlugin/__snapshots__/commonsChunkPlugin.test.js.snap b/packages/migrate/commonsChunkPlugin/__snapshots__/commonsChunkPlugin.test.js.snap new file mode 100644 index 00000000000..27d99f3fa80 --- /dev/null +++ b/packages/migrate/commonsChunkPlugin/__snapshots__/commonsChunkPlugin.test.js.snap @@ -0,0 +1,62 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`commonsChunkPlugin transforms correctly using "commonsChunkPlugin-0" data 1`] = ` +"module.export = { + optimizations: { + splitChunks: { + cacheGroup: { + common: { + name: 'common', + chunks: 'initial' + }, + + vendor: { + name: 'vendor', + test: '/node_modules/', + chunks: 'initial' + } + } + } + } +} +" +`; + +exports[`commonsChunkPlugin transforms correctly using "commonsChunkPlugin-1" data 1`] = ` +"module.export = { + optimizations: { + splitChunks: { + cacheGroup: { + common: { + name: 'common', + chunks: 'initial' + }, + + vendor: { + name: 'vendor', + test: '/node_modules/', + chunks: 'initial' + } + } + } + } +} +" +`; + +exports[`commonsChunkPlugin transforms correctly using "commonsChunkPlugin-2" data 1`] = ` +"module.export = { + optimizations: { + splitChunks: { + cacheGroup: { + vendor: { + name: 'vendor', + test: '/node_modules/', + chunks: 'initial' + } + } + } + } +} +" +`; diff --git a/packages/migrate/commonsChunkPlugin/__testfixtures__/.editorconfig b/packages/migrate/commonsChunkPlugin/__testfixtures__/.editorconfig new file mode 100644 index 00000000000..adbdb1ba476 --- /dev/null +++ b/packages/migrate/commonsChunkPlugin/__testfixtures__/.editorconfig @@ -0,0 +1,3 @@ +[*] +indent_style = space +indent_size = 4 diff --git a/packages/migrate/commonsChunkPlugin/__testfixtures__/commonsChunkPlugin-0.input.js b/packages/migrate/commonsChunkPlugin/__testfixtures__/commonsChunkPlugin-0.input.js new file mode 100644 index 00000000000..b9825251e65 --- /dev/null +++ b/packages/migrate/commonsChunkPlugin/__testfixtures__/commonsChunkPlugin-0.input.js @@ -0,0 +1,8 @@ +module.export = { + plugins: [ + new webpack.commonsChunkPlugin({ + names: ["common", "vendor"], + minChunks: 2 + }) + ] +} diff --git a/packages/migrate/commonsChunkPlugin/__testfixtures__/commonsChunkPlugin-1.input.js b/packages/migrate/commonsChunkPlugin/__testfixtures__/commonsChunkPlugin-1.input.js new file mode 100644 index 00000000000..33e8c800fe2 --- /dev/null +++ b/packages/migrate/commonsChunkPlugin/__testfixtures__/commonsChunkPlugin-1.input.js @@ -0,0 +1,7 @@ +module.export = { + plugins: [ + new webpack.commonsChunkPlugin({ + names: ["common", "vendor"] + }) + ] +} diff --git a/packages/migrate/commonsChunkPlugin/__testfixtures__/commonsChunkPlugin-2.input.js b/packages/migrate/commonsChunkPlugin/__testfixtures__/commonsChunkPlugin-2.input.js new file mode 100644 index 00000000000..876d277291a --- /dev/null +++ b/packages/migrate/commonsChunkPlugin/__testfixtures__/commonsChunkPlugin-2.input.js @@ -0,0 +1,7 @@ +module.export = { + plugins: [ + new webpack.commonsChunkPlugin({ + names: ["vendor"] + }) + ] +} diff --git a/packages/migrate/commonsChunkPlugin/commonsChunkPlugin.test.js b/packages/migrate/commonsChunkPlugin/commonsChunkPlugin.test.js new file mode 100644 index 00000000000..a8341ea5be9 --- /dev/null +++ b/packages/migrate/commonsChunkPlugin/commonsChunkPlugin.test.js @@ -0,0 +1,7 @@ +"use strict"; + +const defineTest = require("@webpack-cli/utils/defineTest").default; + +defineTest(__dirname, "commonsChunkPlugin", "commonsChunkPlugin-0"); +defineTest(__dirname, "commonsChunkPlugin", "commonsChunkPlugin-1"); +defineTest(__dirname, "commonsChunkPlugin", "commonsChunkPlugin-2"); diff --git a/packages/migrate/commonsChunkPlugin/commonsChunkPlugin.ts b/packages/migrate/commonsChunkPlugin/commonsChunkPlugin.ts new file mode 100644 index 00000000000..5d146a306b8 --- /dev/null +++ b/packages/migrate/commonsChunkPlugin/commonsChunkPlugin.ts @@ -0,0 +1,119 @@ +import { + addOrUpdateConfigObject, + createIdentifierOrLiteral, + createLiteral, + createProperty, + findAndRemovePluginByName, + findPluginsByName, +} from "@webpack-cli/utils/ast-utils"; + +import { IJSCodeshift, INode } from "../types/NodePath"; + +/** + * + * Transform for commonsChunkPlugin. If found, removes the + * plugin and sets optimizations.namedModules to true + * + * @param {Object} j - jscodeshift top-level import + * @param {Node} ast - jscodeshift ast to transform + * @returns {Node} ast - jscodeshift ast + */ +export default function(j: IJSCodeshift, ast: INode): INode { + + let pluginProps: INode[]; + const cacheGroupsArray: INode[] = []; + + // find old options + const commonsChunkPlugin = findPluginsByName(j, ast, ["webpack.commonsChunkPlugin"]); + + if (!commonsChunkPlugin.size()) { return ast; } + + commonsChunkPlugin + .forEach((path: INode): void => { + pluginProps = path.value.arguments[0].properties; // any node + }); + + function createChunkCache(chunkName) { + const commonProperties = [ + createProperty( + j, + "name", + chunkName.value, + ), + ]; + switch (chunkName.value) { + case "vendor": + return j.property( + "init", + createIdentifierOrLiteral(j, chunkName.value), + j.objectExpression([ + ...commonProperties, + createProperty( + j, + "test", + "/node_modules/", + ), + createProperty( + j, + "chunks", + "initial", + ), + ]), + ); + case "common": + return j.property( + "init", + createIdentifierOrLiteral(j, chunkName.value), + j.objectExpression([ + ...commonProperties, + createProperty( + j, + "chunks", + "initial", + ), + ]), + ); + default: + return j.property( + "init", + createIdentifierOrLiteral(j, chunkName.value), + j.objectExpression([ + ...commonProperties, + ]), + ); + } + } + + // iterate old options and map new object + pluginProps.forEach((p: INode) => { + if (p.key.name === "names") { + p.value.elements.forEach((chunkName) => { + cacheGroupsArray.push( + createChunkCache(chunkName), + ); + }); + } + }); + + // Remove old plugin + const root: INode = findAndRemovePluginByName(j, ast, "webpack.commonsChunkPlugin"); + + // Add new optimizations splitChunks option + if (root) { + addOrUpdateConfigObject( + j, + root, + "optimizations", + "splitChunks", + j.objectExpression([ + j.property( + "init", + createIdentifierOrLiteral(j, "cacheGroup"), + j.objectExpression(cacheGroupsArray), + ), + ]), + ); + } + + return ast; +} diff --git a/packages/migrate/migrate.ts b/packages/migrate/migrate.ts index f93cded0c94..6d3ad4ec6f3 100644 --- a/packages/migrate/migrate.ts +++ b/packages/migrate/migrate.ts @@ -3,6 +3,7 @@ import pEachSeries = require("p-each-series"); import pLazy = require("p-lazy"); import bannerPluginTransform from "./bannerPlugin/bannerPlugin"; +import commonsChunkPluginTransform from "./commonsChunkPlugin/commonsChunkPlugin"; import extractTextPluginTransform from "./extractTextPlugin/extractTextPlugin"; import loaderOptionsPluginTransform from "./loaderOptionsPlugin/loaderOptionsPlugin"; import loadersTransform from "./loaders/loaders"; @@ -15,6 +16,7 @@ import uglifyJsPluginTransform from "./uglifyJsPlugin/uglifyJsPlugin"; interface ITransformsObject { bannerPluginTransform: object; + commonsChunkPluginTransform?: object; extractTextPluginTransform: object; loaderOptionsPluginTransform: object; loadersTransform: object; @@ -36,6 +38,7 @@ const transformsObject: ITransformsObject = { extractTextPluginTransform, noEmitOnErrorsPluginTransform, removeDeprecatedPluginsTransform, + commonsChunkPluginTransform, }; /* tslint:enable object-literal-sort-keys */