Lodash: Remove completely (#52571)

* Remove Lodash dependency from Gutenberg 🎉 * Ignore Lodash imports in dependency-extraction-webpack-plugin * Remove granular module import forbids from ESLint config * Remove Lodash from dependency adding example * Use spread instead of lodash.assign, do not promote mutation
WordPress · Jul 14, 2023 · f15f26b · f15f26b
1 parent 19f84ba
commit f15f26b
Show file tree

Hide file tree

Showing 13 changed files with 31 additions and 137 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -44,125 +44,7 @@ const restrictedImports = [
 	},
 	{
 		name: 'lodash',
-		importNames: [
-			'camelCase',
-			'capitalize',
-			'castArray',
-			'chunk',
-			'clamp',
-			'clone',
-			'cloneDeep',
-			'compact',
-			'concat',
-			'countBy',
-			'debounce',
-			'deburr',
-			'defaults',
-			'defaultTo',
-			'delay',
-			'difference',
-			'differenceWith',
-			'dropRight',
-			'each',
-			'escape',
-			'escapeRegExp',
-			'every',
-			'extend',
-			'filter',
-			'find',
-			'findIndex',
-			'findKey',
-			'findLast',
-			'first',
-			'flatMap',
-			'flatten',
-			'flattenDeep',
-			'flow',
-			'flowRight',
-			'forEach',
-			'fromPairs',
-			'get',
-			'groupBy',
-			'has',
-			'identity',
-			'includes',
-			'invoke',
-			'isArray',
-			'isBoolean',
-			'isEmpty',
-			'isEqual',
-			'isFinite',
-			'isFunction',
-			'isMatch',
-			'isNil',
-			'isNumber',
-			'isObject',
-			'isObjectLike',
-			'isPlainObject',
-			'isString',
-			'isUndefined',
-			'kebabCase',
-			'keyBy',
-			'keys',
-			'last',
-			'lowerCase',
-			'map',
-			'mapKeys',
-			'mapValues',
-			'maxBy',
-			'memoize',
-			'merge',
-			'mergeWith',
-			'negate',
-			'noop',
-			'nth',
-			'omit',
-			'omitBy',
-			'once',
-			'orderby',
-			'overEvery',
-			'partial',
-			'partialRight',
-			'pick',
-			'pickBy',
-			'random',
-			'reduce',
-			'reject',
-			'repeat',
-			'reverse',
-			'set',
-			'setWith',
-			'size',
-			'snakeCase',
-			'some',
-			'sortBy',
-			'startCase',
-			'startsWith',
-			'stubFalse',
-			'stubTrue',
-			'sum',
-			'sumBy',
-			'take',
-			'throttle',
-			'times',
-			'toString',
-			'trim',
-			'truncate',
-			'unescape',
-			'unionBy',
-			'uniq',
-			'uniqBy',
-			'uniqueId',
-			'uniqWith',
-			'upperFirst',
-			'values',
-			'without',
-			'words',
-			'xor',
-			'zip',
-		],
-		message:
-			'This Lodash method is not recommended. Please use native functionality instead. If using `memoize`, please use `memize` instead.',
+		message: 'Please use native functionality instead.',
 	},
 	{
 		name: 'reakit',

diff --git a/docs/reference-guides/filters/block-filters.md b/docs/reference-guides/filters/block-filters.md
@@ -63,11 +63,13 @@ function addListBlockClassName( settings, name ) {
 		return settings;
 	}
 
-	return lodash.assign( {}, settings, {
-		supports: lodash.assign( {}, settings.supports, {
+	return {
+		...settings,
+		supports: {
+			...settings.supports,
 			className: true,
-		} ),
-	} );
+		},
+	};
 }
 
 wp.hooks.addFilter(
@@ -126,7 +128,10 @@ Adding a background by default to all blocks.
 
 ```js
 function addBackgroundColorStyle( props ) {
-	return lodash.assign( props, { style: { backgroundColor: 'red' } } );
+	return {
+		...props,
+		style: { backgroundColor: 'red' },
+	};
 }
 
 wp.hooks.addFilter(
@@ -276,9 +281,10 @@ var withClientIdClassName = wp.compose.createHigherOrderComponent( function (
 	BlockListBlock
 ) {
 	return function ( props ) {
-		var newProps = lodash.assign( {}, props, {
+		var newProps = {
+			...props,
 			className: 'block-' + props.clientId,
-		} );
+		};
 
 		return el( BlockListBlock, newProps );
 	};

diff --git a/package.json b/package.json
@@ -123,7 +123,6 @@
 		"@types/estree": "0.0.50",
 		"@types/highlight-words-core": "1.2.1",
 		"@types/istanbul-lib-report": "3.0.0",
-		"@types/lodash": "4.14.172",
 		"@types/mime": "2.0.3",
 		"@types/npm-package-arg": "6.1.1",
 		"@types/prettier": "2.4.4",
@@ -207,7 +206,6 @@
 		"jest-watch-typeahead": "2.2.2",
 		"lerna": "5.5.2",
 		"lint-staged": "10.0.1",
-		"lodash": "4.17.21",
 		"make-dir": "3.0.0",
 		"metro-react-native-babel-preset": "0.70.3",
 		"metro-react-native-babel-transformer": "0.70.3",

diff --git a/packages/README.md b/packages/README.md
@@ -75,10 +75,10 @@ The simplest way to add a production dependency to one of the packages is to run
 _Example:_
 
 ```bash
-lerna add lodash packages/a11y
+lerna add change-case packages/a11y
 ```
 
-This command adds the latest version of `lodash` as a dependency to the `@wordpress/a11y` package, which is located in `packages/a11y` folder.
+This command adds the latest version of `change-case` as a dependency to the `@wordpress/a11y` package, which is located in `packages/a11y` folder.
 
 #### Removing Existing Dependencies
 

diff --git a/packages/dependency-extraction-webpack-plugin/test/__snapshots__/build.js.snap b/packages/dependency-extraction-webpack-plugin/test/__snapshots__/build.js.snap
@@ -50,7 +50,7 @@ exports[`DependencyExtractionWebpackPlugin Webpack \`dynamic-import\` should pro
 `;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`function-output-filename\` should produce expected output: Asset file 'chunk--main--main.asset.php' should match snapshot 1`] = `
-"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => '9b7ebe61044661fdabda');
+"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => 'fc2d750fc9e08c5749db');
 "
 `;
 
@@ -96,7 +96,7 @@ exports[`DependencyExtractionWebpackPlugin Webpack \`has-extension-suffix\` shou
 `;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`no-default\` should produce expected output: Asset file 'main.asset.php' should match snapshot 1`] = `
-"<?php return array('dependencies' => array(), 'version' => 'f7e2cb527e601f74f8bd');
+"<?php return array('dependencies' => array(), 'version' => '43880e6c42e7c39fcdf1');
 "
 `;
 
@@ -110,7 +110,7 @@ exports[`DependencyExtractionWebpackPlugin Webpack \`no-deps\` should produce ex
 exports[`DependencyExtractionWebpackPlugin Webpack \`no-deps\` should produce expected output: External modules should match snapshot 1`] = `[]`;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`option-function-output-filename\` should produce expected output: Asset file 'chunk--main--main.asset.php' should match snapshot 1`] = `
-"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => '9b7ebe61044661fdabda');
+"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => 'fc2d750fc9e08c5749db');
 "
 `;
 
@@ -133,7 +133,7 @@ exports[`DependencyExtractionWebpackPlugin Webpack \`option-function-output-file
 `;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`option-output-filename\` should produce expected output: Asset file 'main-foo.asset.php' should match snapshot 1`] = `
-"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => '9b7ebe61044661fdabda');
+"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => 'fc2d750fc9e08c5749db');
 "
 `;
 
@@ -155,7 +155,7 @@ exports[`DependencyExtractionWebpackPlugin Webpack \`option-output-filename\` sh
 ]
 `;
 
-exports[`DependencyExtractionWebpackPlugin Webpack \`output-format-json\` should produce expected output: Asset file 'main.asset.json' should match snapshot 1`] = `"{"dependencies":["lodash"],"version":"4c42b9646049ad2e9438"}"`;
+exports[`DependencyExtractionWebpackPlugin Webpack \`output-format-json\` should produce expected output: Asset file 'main.asset.json' should match snapshot 1`] = `"{"dependencies":["lodash"],"version":"7bd48470d799a795bf9a"}"`;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`output-format-json\` should produce expected output: External modules should match snapshot 1`] = `
 [
@@ -240,7 +240,7 @@ exports[`DependencyExtractionWebpackPlugin Webpack \`runtime-chunk-single\` shou
 `;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`style-imports\` should produce expected output: Asset file 'main.asset.php' should match snapshot 1`] = `
-"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => 'd8c0ee89d933a3809c0e');
+"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => '4c661914a4e4d80b8a0b');
 "
 `;
 
@@ -263,7 +263,7 @@ exports[`DependencyExtractionWebpackPlugin Webpack \`style-imports\` should prod
 `;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`wordpress\` should produce expected output: Asset file 'main.asset.php' should match snapshot 1`] = `
-"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => '9b7ebe61044661fdabda');
+"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => 'fc2d750fc9e08c5749db');
 "
 `;
 

diff --git a/...ages/dependency-extraction-webpack-plugin/test/fixtures/function-output-filename/index.js b/...ages/dependency-extraction-webpack-plugin/test/fixtures/function-output-filename/index.js
@@ -6,6 +6,7 @@ import { isBlobURL } from '@wordpress/blob';
 /**
  * External dependencies
  */
+// eslint-disable-next-line no-restricted-imports
 import _ from 'lodash';
 
 _.isEmpty( isBlobURL( '' ) );
diff --git a/packages/dependency-extraction-webpack-plugin/test/fixtures/no-default/index.js b/packages/dependency-extraction-webpack-plugin/test/fixtures/no-default/index.js
@@ -1,6 +1,7 @@
 /**
  * External dependencies
  */
+// eslint-disable-next-line no-restricted-imports
 import _ from 'lodash';
 
 _.map( [], _.identity );
diff --git a/...pendency-extraction-webpack-plugin/test/fixtures/option-function-output-filename/index.js b/...pendency-extraction-webpack-plugin/test/fixtures/option-function-output-filename/index.js
@@ -6,6 +6,7 @@ import { isBlobURL } from '@wordpress/blob';
 /**
  * External dependencies
  */
+// eslint-disable-next-line no-restricted-imports
 import _ from 'lodash';
 
 _.isEmpty( isBlobURL( '' ) );
diff --git a/packages/dependency-extraction-webpack-plugin/test/fixtures/option-output-filename/index.js b/packages/dependency-extraction-webpack-plugin/test/fixtures/option-output-filename/index.js
@@ -6,6 +6,7 @@ import { isBlobURL } from '@wordpress/blob';
 /**
  * External dependencies
  */
+// eslint-disable-next-line no-restricted-imports
 import _ from 'lodash';
 
 _.isEmpty( isBlobURL( '' ) );
diff --git a/packages/dependency-extraction-webpack-plugin/test/fixtures/output-format-json/index.js b/packages/dependency-extraction-webpack-plugin/test/fixtures/output-format-json/index.js
@@ -1,6 +1,7 @@
 /**
  * External dependencies
  */
+// eslint-disable-next-line no-restricted-imports
 import _ from 'lodash';
 
 _.map( [], _.identity );
diff --git a/packages/dependency-extraction-webpack-plugin/test/fixtures/runtime-chunk-single/b.js b/packages/dependency-extraction-webpack-plugin/test/fixtures/runtime-chunk-single/b.js
@@ -6,6 +6,7 @@ import { isBlobURL } from '@wordpress/blob';
 /**
  * External dependencies
  */
+// eslint-disable-next-line no-restricted-imports
 import _ from 'lodash';
 
 _.isEmpty( isBlobURL( '' ) );
diff --git a/packages/dependency-extraction-webpack-plugin/test/fixtures/style-imports/index.js b/packages/dependency-extraction-webpack-plugin/test/fixtures/style-imports/index.js
@@ -6,6 +6,7 @@ import { isBlobURL } from '@wordpress/blob';
 /**
  * External dependencies
  */
+// eslint-disable-next-line no-restricted-imports
 import _ from 'lodash';
 
 /**

diff --git a/packages/dependency-extraction-webpack-plugin/test/fixtures/wordpress/index.js b/packages/dependency-extraction-webpack-plugin/test/fixtures/wordpress/index.js
@@ -6,6 +6,7 @@ import { isBlobURL } from '@wordpress/blob';
 /**
  * External dependencies
  */
+// eslint-disable-next-line no-restricted-imports
 import _ from 'lodash';
 
 _.isEmpty( isBlobURL( '' ) );
-Original file line number
+Diff line change
@@ Expand Up / @@ -6,6 +6,7 @@ import { isBlobURL } from '@wordpress/blob'; @@
     /**
      * External dependencies
      */
+    // eslint-disable-next-line no-restricted-imports
     import _ from 'lodash';
     /**
@@ Expand Down @@