style(eslint-config): add eslint rules to restrict the imports of lodash (#15773)

* style(eslint-config): add eslint rules to restrict the imports of lodash

* fix: lint error

* test(components): [infinite-scroll] test error

* test(components): [infinite-scroll] test error

internal/build/src/tasks/full-bundle.ts

@@ -8,7 +8,7 @@ import vueJsx from '@vitejs/plugin-vue-jsx'
 import esbuild, { minify as minifyPlugin } from 'rollup-plugin-esbuild'
 import { parallel } from 'gulp'
 import glob from 'fast-glob'
-import { camelCase, upperFirst } from 'lodash'
+import { camelCase, upperFirst } from 'lodash-unified'
 import {
   PKG_BRAND_NAME,
   PKG_CAMELCASE_LOCAL_NAME,
@@ -24,6 +24,7 @@ import {
   writeBundles,
 } from '../utils'
 import { target } from '../build-info'
+import type { TaskFunction } from 'gulp'
 import type { Plugin } from 'rollup'
 
 const banner = `/*! ${PKG_BRAND_NAME} v${version} */\n`
@@ -154,7 +155,7 @@ async function buildFullLocale(minify: boolean) {
 export const buildFull = (minify: boolean) => async () =>
   Promise.all([buildFullEntry(minify), buildFullLocale(minify)])
 
-export const buildFullBundle = parallel(
+export const buildFullBundle: TaskFunction = parallel(
   withTaskName('buildFullMinified', buildFull(true)),
   withTaskName('buildFull', buildFull(false))
 )

internal/eslint-config/index.js

@@ -262,6 +262,21 @@ module.exports = defineConfig({
     'import/no-named-as-default': 'off',
     'import/no-named-as-default-member': 'off',
     'import/named': 'off',
+    'no-restricted-imports': [
+      'error',
+      {
+        paths: [
+          { name: 'lodash', message: 'Use lodash-unified instead.' },
+          { name: 'lodash-es', message: 'Use lodash-unified instead.' },
+        ],
+        patterns: [
+          {
+            group: ['lodash/*', 'lodash-es/*'],
+            message: 'Use lodash-unified instead.',
+          },
+        ],
+      },
+    ],
 
     // eslint-plugin-eslint-comments
     'eslint-comments/disable-enable-pair': ['error', { allowWholeFile: true }],

internal/metadata/src/contributor.ts

@@ -4,7 +4,7 @@ import glob from 'fast-glob'
 import { Octokit } from 'octokit'
 import consola from 'consola'
 import chalk from 'chalk'
-import { chunk, mapValues, uniqBy } from 'lodash-es'
+import { chunk, mapValues, uniqBy } from 'lodash-unified'
 import {
   ensureDir,
   errorAndExit,

packages/components/infinite-scroll/__tests__/infinite-scroll.test.ts

@@ -15,8 +15,9 @@ import makeScroll from '@element-plus/test-utils/make-scroll'
 import tick from '@element-plus/test-utils/tick'
 import InfiniteScroll, { DEFAULT_DELAY, SCOPE } from '../src'
 
-vi.mock('lodash-unified', () => {
+vi.mock('lodash-unified', async () => {
   return {
+    ...((await vi.importActual('lodash-unified')) as Record<string, any>),
     throttle: vi.fn((fn) => {
       fn.cancel = vi.fn()
       fn.flush = vi.fn()

packages/components/tour/src/step.vue

@@ -66,7 +66,7 @@
 
 <script lang="ts" setup>
 import { computed, inject, watch } from 'vue'
-import { omit } from 'lodash-es'
+import { omit } from 'lodash-unified'
 import { ElButton } from '@element-plus/components/button'
 import { ElIcon } from '@element-plus/components/icon'
 import { CloseComponents } from '@element-plus/utils'

packages/test-utils/define-getter.ts

@@ -1,4 +1,4 @@
-import { isFunction, isUndefined } from 'lodash'
+import { isFunction, isUndefined } from 'lodash-unified'
 
 /**
  *

packages/test-utils/make-mount.ts

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils'
-import { merge } from 'lodash'
+import { merge } from 'lodash-unified'
 
 const makeMount = <C, O, E>(element: C, defaultOptions: O) => {
   return (props: (E | O) | (E & O) = {} as E) =>

packages/utils/__tests__/arrays.test.ts

@@ -1,5 +1,5 @@
 import { describe, expect, it } from 'vitest'
-import { castArray as lodashCastArray } from 'lodash-es'
+import { castArray as lodashCastArray } from 'lodash-unified'
 import { castArray, ensureArray, unique } from '..'
 
 describe('arrays', () => {