refactor: lodash-es instead of lodash

.eslintrc.js

@@ -7,7 +7,7 @@ module.exports = {
     'plugin:@typescript-eslint/recommended',
   ],
   parser: '@typescript-eslint/parser',
-  plugins: ['@typescript-eslint', 'react-hooks', 'lodash'],
+  plugins: ['@typescript-eslint', 'react-hooks'],
   env: {
     browser: true,
     node: true,
@@ -73,6 +73,16 @@ module.exports = {
     'func-names': 'off',
     'consistent-return': 'off',
     'default-case': 'off',
-    'lodash/import-scope': [2, 'method'],
+    'no-restricted-imports': [
+      'error',
+      {
+        paths: [
+          {
+            name: 'lodash',
+            message: 'Please use lodash-es instead.',
+          },
+        ],
+      },
+    ],
   },
 };

package.json

@@ -91,7 +91,7 @@
     "@testing-library/jest-dom": "^5.16.2",
     "@testing-library/react": "^12.1.4",
     "@testing-library/user-event": "^13.5.0",
-    "@types/lodash": "^4.14.178",
+    "@types/lodash-es": "^4.17.12",
     "@types/node": "^20.14.11",
     "@types/react": "^17.0.2",
     "@types/react-dom": "17.0.2",
@@ -119,7 +119,6 @@
     "eslint-config-prettier": "^8.3.0",
     "eslint-plugin-import": "^2.25.3",
     "eslint-plugin-jsx-a11y": "^6.5.1",
-    "eslint-plugin-lodash": "^7.4.0",
     "eslint-plugin-react": "^7.27.1",
     "eslint-plugin-react-hooks": "^4.3.0",
     "find-node-modules": "^2.1.2",
@@ -167,7 +166,7 @@
     "classnames": "^2.3.1",
     "dayjs": "^1.11.13",
     "hoist-non-react-statics": "^3.3.2",
-    "lodash": "^4.17.21",
+    "lodash-es": "^4.17.21",
     "react-spring": "9.6.1",
     "react-transition-group": "^4.4.2",
     "smoothscroll-polyfill": "^0.4.4",

script/generate-coverage.js

@@ -1,6 +1,6 @@
 const fs = require('fs');
 const path = require('path');
-const camelCase = require('lodash/camelCase');
+const { camelCase } = require('lodash-es');
 
 const DomParser = require('dom-parser');
 

script/rollup.config.js

@@ -215,7 +215,7 @@ const umdConfig = {
     banner,
     format: 'umd',
     exports: 'named',
-    globals: { react: 'React', lodash: '_' },
+    globals: { react: 'React' },
     sourcemap: true,
     file: `dist/${name}.js`,
   },
@@ -235,7 +235,7 @@ const umdMinConfig = {
     banner,
     format: 'umd',
     exports: 'named',
-    globals: { react: 'React', lodash: '_' },
+    globals: { react: 'React' },
     sourcemap: true,
     file: `dist/${name}.min.js`,
   },

src/_util/convertUnit.ts

@@ -1,4 +1,4 @@
-import isNumber from 'lodash/isNumber';
+import { isNumber } from 'lodash-es';
 
 export const convertUnit = (val: string | number | undefined) => {
   if (val == null) return 0;

src/_util/getContainer.ts

@@ -1,7 +1,6 @@
-import isFunction from 'lodash/isFunction';
-import isString from 'lodash/isString';
+import { isFunction, isString } from 'lodash-es';
 
-import { ScrollContainerElement, ScrollContainer } from '../common'
+import { ScrollContainerElement, ScrollContainer } from '../common';
 
 export function resolveContainer(getContainer: ScrollContainerElement | ScrollContainer): ScrollContainerElement {
   if (isString(getContainer)) {

src/_util/nearest.ts

@@ -1,4 +1,4 @@
-import isNumber from 'lodash/isNumber';
+import { isNumber } from 'lodash-es';
 
 export interface nearestParams {
   items: number[]; // 一组数字

src/_util/parseTNode.ts

@@ -1,5 +1,5 @@
 import React, { ReactElement, ReactNode } from 'react';
-import isFunction from 'lodash/isFunction';
+import { isFunction } from 'lodash-es';
 import { TNode } from '../common';
 import log from '../_common/js/log';
 

src/_util/withNativeProps.ts

@@ -1,8 +1,7 @@
 import React from 'react';
 import type { CSSProperties, ReactElement } from 'react';
 import cls from 'classnames';
-import keys from 'lodash/keys';
-import assign from 'lodash/assign';
+import { assign, keys } from 'lodash-es';
 
 export interface NativeProps<S extends string = never> {
   className?: string;

src/back-top/Backtop.tsx

@@ -2,7 +2,7 @@ import React, { useRef, useEffect } from 'react';
 import classNames from 'classnames';
 import { useScroll, useMount, useBoolean } from 'ahooks';
 import smoothscroll from 'smoothscroll-polyfill';
-import isString from 'lodash/isString';
+import { isString } from 'lodash-es';
 import { Icon } from 'tdesign-icons-react';
 import withNativeProps, { NativeProps } from '../_util/withNativeProps';
 import useConfig from '../_util/useConfig';

src/badge/Badge.tsx

@@ -1,7 +1,6 @@
 import React, { forwardRef, useMemo } from 'react';
 import classNames from 'classnames';
-import isNumber from 'lodash/isNumber';
-import isString from 'lodash/isString';
+import { isNumber, isString } from 'lodash-es';
 import type { StyledProps } from '../common';
 import type { TdBadgeProps } from './type';
 import { badgeDefaultProps } from './defaultProps';

src/cell/Cell.tsx

@@ -1,6 +1,6 @@
 import React, { useMemo, useCallback } from 'react';
 import classnames from 'classnames';
-import isString from 'lodash/isString';
+import { isString } from 'lodash-es';
 import { ChevronRightIcon } from 'tdesign-icons-react';
 
 import parseTNode from '../_util/parseTNode';

src/checkbox/CheckboxGroup.tsx

@@ -1,5 +1,5 @@
 import React, { FC, ReactElement, useEffect, useMemo, useState } from 'react';
-import isNumber from 'lodash/isNumber';
+import { isNumber } from 'lodash-es';
 import classNames from 'classnames';
 import { CheckboxOption, CheckboxOptionObj, TdCheckboxGroupProps } from './type';
 import { StyledProps } from '../common';

src/grid/GridItem.tsx

@@ -1,8 +1,6 @@
 import React, { FC, useContext, useMemo } from 'react';
 import cls from 'classnames';
-import isString from 'lodash/isString';
-import isObject from 'lodash/isObject';
-import isFunction from 'lodash/isFunction';
+import { isFunction, isString, isObject } from 'lodash-es';
 import useConfig from '../_util/useConfig';
 import parseTNode from '../_util/parseTNode';
 import useDefaultProps from '../hooks/useDefaultProps';

src/guide/Guide.tsx

@@ -9,7 +9,7 @@ import { TdGuideProps, GuideCrossProps } from './type';
 
 import Portal from '../common/Portal';
 import { SizeEnum, StyledProps } from '../common';
-import setStyle from '../_common/js/utils/set-style';
+import setStyle from '../_common/js/utils/setStyle';
 
 import { usePrefixClass } from '../hooks/useClass';
 import useDefault from '../_util/useDefault';

src/guide/utils/dom.ts

@@ -1,5 +1,4 @@
-import isString from 'lodash/isString';
-import isFunction from 'lodash/isFunction';
+import { isFunction, isString } from 'lodash-es';
 import { AttachNode } from '../../common';
 import { elementInViewport, getWindowScroll, getWindowSize } from './shared';
 /**

src/guide/utils/shared.ts

@@ -1,5 +1,4 @@
-import isFunction from 'lodash/isFunction';
-import isString from 'lodash/isString';
+import { isFunction, isString } from 'lodash-es';
 
 const trim = (str: string): string => (str || '').replace(/^[\s\uFEFF]+|[\s\uFEFF]+$/g, '');
 

src/indexes/Indexes.tsx

@@ -1,5 +1,5 @@
 import React, { useState, useRef, useEffect, useMemo } from 'react';
-import throttle from 'lodash/throttle';
+import { throttle } from 'lodash-es';
 import cls from 'classnames';
 import { TdIndexesProps } from './type';
 import { StyledProps } from '../common';

src/input/Input.tsx

@@ -1,7 +1,7 @@
 import React, { forwardRef, useEffect, useImperativeHandle, useRef, useState } from 'react';
 import type { FocusEvent, TouchEvent, CompositionEvent, FormEvent } from 'react';
 import classNames from 'classnames';
-import isFunction from 'lodash/isFunction';
+import { isFunction } from 'lodash-es';
 import { CloseCircleFilledIcon, BrowseOffIcon, BrowseIcon } from 'tdesign-icons-react';
 import useDefault from '../_util/useDefault';
 import parseTNode from '../_util/parseTNode';

src/message/Message.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useState, useRef } from 'react';
 import classNames from 'classnames';
 import { useTimeout } from 'ahooks';
-import isObject from 'lodash/isObject';
+import { isObject } from 'lodash-es';
 import { CSSTransition } from 'react-transition-group';
 import { Icon } from 'tdesign-icons-react';
 

src/message/hooks/useMessageCssTransition.ts

@@ -1,5 +1,4 @@
 import { useRef } from 'react';
-// import identity from 'lodash/identity';
 import ReactDOM from 'react-dom';
 
 interface UseMessageCssTransitionParams {

src/notice-bar/NoticeBar.tsx

@@ -1,8 +1,7 @@
 import React, { useEffect, useMemo, useRef, useState } from 'react';
 import { InfoCircleFilledIcon, CheckCircleFilledIcon } from 'tdesign-icons-react';
 import classNames from 'classnames';
-import isObject from 'lodash/isObject';
-import isArray from 'lodash/isArray';
+import { isArray, isObject } from 'lodash-es';
 import parseTNode from '../_util/parseTNode';
 import Swiper from '../swiper';
 import SwiperItem from '../swiper/SwiperItem';

src/picker/PickerItem.tsx

@@ -1,6 +1,6 @@
 import React, { FC, useRef, memo, useCallback, useContext, useMemo } from 'react';
 import { useDebounceEffect } from 'ahooks';
-import isUndefined from 'lodash/isUndefined';
+import { isUndefined } from 'lodash-es';
 import { useDrag } from '@use-gesture/react';
 import { useSpring, animated } from '@react-spring/web';
 import useConfig from '../_util/useConfig';

src/picker/PickerView.tsx

@@ -1,5 +1,5 @@
 import React, { FC, useMemo } from 'react';
-import isUndefined from 'lodash/isUndefined';
+import { isUndefined } from 'lodash-es';
 import useConfig from '../_util/useConfig';
 import useDefault from '../_util/useDefault';
 import withNativeProps, { NativeProps } from '../_util/withNativeProps';

src/picker/_example/base.jsx

@@ -1,5 +1,5 @@
 import React, { useState } from 'react';
-import isEmpty from 'lodash/isEmpty';
+import { isEmpty } from 'lodash-es';
 import { Picker, PickerItem, Cell } from 'tdesign-mobile-react';
 import TDemoBlock from '../../../site/mobile/components/DemoBlock';
 import './style/index.less';

src/progress/Progress.tsx

@@ -8,7 +8,7 @@ import {
   CloseCircleFilledIcon,
   ErrorCircleFilledIcon,
 } from 'tdesign-icons-react';
-import isString from 'lodash/isString';
+import { isString } from 'lodash-es';
 import { StyledProps } from '../common';
 import { TdProgressProps } from './type';
 import useConfig from '../_util/useConfig';

src/pull-down-refresh/PullDownRefresh.tsx

@@ -1,7 +1,6 @@
 import React, { useRef, useState, type ReactNode, useEffect, useMemo } from 'react';
 import classNames from 'classnames';
-import uniqueId from 'lodash/uniqueId';
-import isBoolean from 'lodash/isBoolean';
+import { uniqueId, isBoolean } from 'lodash-es';
 
 import { useDebounceFn } from 'ahooks';
 import Loading from '../loading';

src/skeleton/Skeleton.tsx

@@ -1,7 +1,6 @@
 import React, { useState, useEffect } from 'react';
 import classNames from 'classnames';
-import isNumber from 'lodash/isNumber';
-import isArray from 'lodash/isArray';
+import { isArray, isNumber } from 'lodash-es';
 import { SkeletonRowCol, SkeletonRowColObj, TdSkeletonProps } from './type';
 import { StyledProps, Styles } from '../common';
 import { skeletonDefaultProps } from './defaultProps';

src/slider/Slider.tsx

@@ -1,8 +1,7 @@
 import React, { FC, useEffect, useRef, useState } from 'react';
 import type { MouseEvent, TouchEvent } from 'react';
 import classNames from 'classnames';
-import isFunction from 'lodash/isFunction';
-import cloneDeep from 'lodash/cloneDeep';
+import { cloneDeep, isFunction } from 'lodash-es';
 import { usePrefixClass } from '../hooks/useClass';
 import useDefaultProps from '../hooks/useDefaultProps';
 import useDefault from '../_util/useDefault';

src/swipe-cell/SwipeCell.tsx

@@ -1,7 +1,6 @@
 import React, { forwardRef, useImperativeHandle, useRef, useMemo, useState } from 'react';
 import type { ReactNode } from 'react';
-import isArray from 'lodash/isArray';
-import isBoolean from 'lodash/isBoolean';
+import { isArray, isBoolean } from 'lodash-es';
 import classNames from 'classnames';
 import { useClickAway } from 'ahooks';
 import { useDrag } from '@use-gesture/react';

src/switch/Switch.tsx

@@ -1,6 +1,6 @@
 import React, { forwardRef, useMemo } from 'react';
 import classNames from 'classnames';
-import isArray from 'lodash/isArray';
+import { isArray } from 'lodash-es';
 import Loading from '../loading';
 import { TdSwitchProps, SwitchValue } from './type';
 import { switchDefaultProps } from './defaultProps';

src/table/BaseTable.tsx

@@ -1,6 +1,5 @@
 import React, { forwardRef, useRef } from 'react';
-import isFunction from 'lodash/isFunction';
-import get from 'lodash/get';
+import { get, isFunction } from 'lodash-es';
 import cx from 'classnames';
 
 import { StyledProps } from '../common';