refactor: lodash-es instead of lodash

.eslintrc

@@ -108,7 +108,13 @@
       {
         "checkLoops": false
       }
-    ]
+    ],
+    "no-restricted-imports": ["error", {
+      "paths": [{
+        "name": "lodash",
+        "message": "Please use lodash-es instead."
+      }]
+    }]
   },
   "overrides": [
     {

package.json

@@ -86,15 +86,14 @@
     "@babel/runtime": "^7.14.8",
     "@popperjs/core": "^2.4.0",
     "@types/clipboard": "^2.0.1",
-    "@types/lodash": "4.14.182",
     "@types/raf": "^3.4.0",
     "@types/sortablejs": "^1.10.7",
     "@types/tinycolor2": "^1.4.3",
     "@types/validator": "^13.1.3",
     "@vue/composition-api": "^1.4.1",
     "clipboard": "^2.0.8",
     "dayjs": "1.11.10",
-    "lodash": "^4.17.21",
+    "lodash-es": "^4.17.21",
     "mitt": "^3.0.0",
     "raf": "^3.4.1",
     "sortablejs": "^1.15.0",
@@ -108,8 +107,8 @@
   "devDependencies": {
     "@babel/cli": "^7.5.5",
     "@babel/core": "~7.22.5",
-    "@babel/helper-module-imports": "7.24.7",
     "@babel/eslint-parser": "~7.23.10",
+    "@babel/helper-module-imports": "7.24.7",
     "@babel/plugin-transform-class-properties": "^7.22.3",
     "@babel/plugin-transform-modules-commonjs": "^7.9.6",
     "@babel/plugin-transform-object-assign": "^7.2.0",
@@ -125,6 +124,7 @@
     "@rollup/plugin-url": "^5.0.1",
     "@testing-library/dom": "^10.2.0",
     "@types/estree": "0.0.50",
+    "@types/lodash-es": "^4.17.12",
     "@typescript-eslint/eslint-plugin": "^5.4.0",
     "@typescript-eslint/experimental-utils": "^5.4.0",
     "@typescript-eslint/parser": "^5.4.0",
@@ -182,7 +182,7 @@
     "tdesign-publish-cli": "^0.0.12",
     "tdesign-site-components": "^0.15.3",
     "tdesign-theme-generator": "^1.0.0",
-    "typescript": "~4.5.4",
+    "typescript": "~4.8.4",
     "unplugin-vue2-script-setup": "^0.10.2",
     "vite": "^2.7.6",
     "vite-plugin-pwa": "^0.11.11",

script/init/index.js

@@ -27,7 +27,7 @@
 
 const fs = require('fs');
 const path = require('path');
-const _ = require('lodash');
+const { template } = require('lodash-es');
 const utils = require('../utils');
 const config = require('./config');
 
@@ -75,7 +75,7 @@ function deleteComponent(toBeCreatedFiles, component) {
 function outputFileWithTemplate(item, component, desc, _d) {
   const tplPath = path.resolve(__dirname, `./tpl/${item.template}`);
   let data = fs.readFileSync(tplPath).toString();
-  const compiled = _.template(data);
+  const compiled = template(data);
   data = compiled({
     component,
     upperComponent: getFirstLetterUpper(component),

script/rollup.config.js

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

site/src/components/codesandbox/content.js

@@ -90,12 +90,14 @@ export const packageJSONContent = JSON.stringify(
       'tdesign-vue': orgPkg.version,
       'tdesign-icons-vue': orgPkg.dependencies['tdesign-icons-vue'],
       vue: orgPkg.devDependencies.vue,
+      'lodash-es': orgPkg.dependencies['lodash-es'],
     },
     devDependencies: {
       vite: orgPkg.devDependencies.vite,
       less: orgPkg.devDependencies.less,
       'vite-plugin-vue2': orgPkg.devDependencies['vite-plugin-vue2'],
       'vue-template-compiler': orgPkg.devDependencies['vue-template-compiler'],
+      '@types/lodash-es': orgPkg.devDependencies['@types/lodash-es'],
     },
   },
   null,

site/src/components/stackblitz/content.js

@@ -116,13 +116,15 @@ export const packageJSONContentForComposition = JSON.stringify(
       'tdesign-vue': orgPkg.version + '-naruto',
       'tdesign-icons-vue': orgPkg.dependencies['tdesign-icons-vue'],
       vue: '2.7.14',
+      'lodash-es': orgPkg.dependencies['lodash-es'],
     },
     devDependencies: {
       vite: '^2.9.6',
       less: orgPkg.devDependencies.less,
       '@vitejs/plugin-vue2': '^1.1.2',
       'vue-template-compiler': '2.7.14',
       '@vitejs/plugin-vue2-jsx': '^1.1.0',
+      '@types/lodash-es': orgPkg.devDependencies['@types/lodash-es'],
     },
   },
   null,

src/affix/affix.tsx

@@ -1,5 +1,5 @@
 import Vue, { VueConstructor } from 'vue';
-import isFunction from 'lodash/isFunction';
+import { isFunction } from 'lodash-es';
 import { on, off, getScrollContainer } from '../utils/dom';
 import affixProps from './props';
 import { ScrollContainerElement } from '../common';

src/anchor/__tests__/anchor-link.test.jsx

@@ -1,6 +1,6 @@
 import { mount } from '@vue/test-utils';
 import Vue from 'vue';
-import omit from 'lodash/omit';
+import { omit } from 'lodash-es';
 import { AnchorItem } from '@/src/anchor/index.ts';
 
 const defaultProvide = {

src/anchor/anchor-item.tsx

@@ -1,6 +1,6 @@
 import Vue, { VueConstructor } from 'vue';
 import { ScopedSlotReturnValue } from 'vue/types/vnode';
-import isEmpty from 'lodash/isEmpty';
+import { isEmpty } from 'lodash-es';
 import { VNode } from 'vue/types/umd';
 import { ANCHOR_SHARP_REGEXP } from './utils';
 import props from './anchor-item-props';

src/anchor/anchor.tsx

@@ -1,6 +1,6 @@
 import Vue, { VueConstructor } from 'vue';
 import { ScopedSlotReturnValue } from 'vue/types/vnode';
-import isFunction from 'lodash/isFunction';
+import { isFunction } from 'lodash-es';
 import { ANCHOR_SHARP_REGEXP, ANCHOR_CONTAINER, getOffsetTop } from './utils';
 import {
   on, off, getScroll, scrollTo, getScrollContainer,

src/auto-complete/_example-composition/filter.vue

@@ -24,7 +24,7 @@
 
 <script setup>
 import { ref } from 'vue';
-import escapeRegExp from 'lodash/escapeRegExp';
+import { escapeRegExp } from 'lodash-es';
 
 const LIST = ['第一个 AutoComplete 默认联想词', '第二个 AutoComplete 默认联想词', '第三个 AutoComplete 默认联想词'];
 const value1 = ref('');

src/auto-complete/_example/filter.vue

@@ -23,7 +23,7 @@
 </template>
 
 <script>
-import escapeRegExp from 'lodash/escapeRegExp';
+import { escapeRegExp } from 'lodash-es';
 
 const LIST = ['第一个 AutoComplete 默认联想词', '第二个 AutoComplete 默认联想词', '第三个 AutoComplete 默认联想词'];
 

src/auto-complete/highlight-option.tsx

@@ -1,5 +1,5 @@
 import { computed, defineComponent } from '@vue/composition-api';
-import escapeRegExp from 'lodash/escapeRegExp';
+import { escapeRegExp } from 'lodash-es';
 import { usePrefixClass } from '../hooks/useConfig';
 
 export default defineComponent({

src/auto-complete/option-list.tsx

@@ -1,8 +1,7 @@
 import {
   ref, computed, defineComponent, PropType, h, watch, onBeforeUnmount,
 } from '@vue/composition-api';
-import isFunction from 'lodash/isFunction';
-import escapeRegExp from 'lodash/escapeRegExp';
+import { isFunction, escapeRegExp } from 'lodash-es';
 import HighlightOption from './highlight-option';
 import { CommonClassNameType } from '../hooks/useCommonClassName';
 import { AutoCompleteOptionObj, TdAutoCompleteProps } from './type';

src/calendar/calendar.tsx

@@ -1,7 +1,7 @@
 import Vue from 'vue';
 // 通用库
 import dayjs from 'dayjs';
-import remove from 'lodash/remove';
+import { remove } from 'lodash-es';
 import calendar from 'dayjs/plugin/calendar';
 import props from './props';
 import mixins from '../utils/mixins';

src/cascader/cascader.tsx

@@ -1,5 +1,5 @@
 import { defineComponent, computed } from '@vue/composition-api';
-import omit from 'lodash/omit';
+import { omit } from 'lodash-es';
 import Panel from './components/Panel';
 import SelectInput, {
   SelectInputChangeContext,

src/cascader/core/effect.ts

@@ -1,6 +1,4 @@
-import isNumber from 'lodash/isNumber';
-import isFunction from 'lodash/isFunction';
-import cloneDeep from 'lodash/cloneDeep';
+import { cloneDeep, isFunction, isNumber } from 'lodash-es';
 import {
   TreeNode, CascaderContextType, TdCascaderProps, TreeNodeValue, TreeNodeModel,
 } from '../interface';

src/cascader/core/helper.ts

@@ -1,4 +1,4 @@
-import isEmpty from 'lodash/isEmpty';
+import { isEmpty } from 'lodash-es';
 import {
   TreeNode,
   CascaderContextType,

src/cascader/hooks.ts

@@ -1,8 +1,7 @@
 import {
   Ref, reactive, computed, toRefs, watch, nextTick,
 } from '@vue/composition-api';
-import isEqual from 'lodash/isEqual';
-import isFunction from 'lodash/isFunction';
+import { isEqual, isFunction } from 'lodash-es';
 
 import TreeStore from '../_common/js/tree/tree-store';
 import useVModel from '../hooks/useVModel';

src/checkbox/group.tsx

@@ -9,9 +9,7 @@ import {
   nextTick,
   onMounted,
 } from '@vue/composition-api';
-import intersection from 'lodash/intersection';
-import isObject from 'lodash/isObject';
-import isUndefined from 'lodash/isUndefined';
+import { intersection, isObject, isUndefined } from 'lodash-es';
 import { VNode } from 'vue';
 import { getVNodeComponentName, getVueComponentName } from '../utils/helper';
 import Checkbox from './checkbox';

src/color-picker/panel/format/index.tsx

@@ -1,7 +1,7 @@
 import {
   defineComponent, PropType, ref, watch,
 } from '@vue/composition-api';
-import upperCase from 'lodash/upperCase';
+import { upperCase } from 'lodash-es';
 import { TdColorHandler } from '../../../color-picker/interfaces';
 import { TdColorPickerProps } from '../../type';
 import props from '../../props';

src/color-picker/panel/format/inputs.tsx

@@ -1,7 +1,7 @@
 import {
   computed, defineComponent, PropType, reactive, watch,
 } from '@vue/composition-api';
-import throttle from 'lodash/throttle';
+import { throttle } from 'lodash-es';
 import { TdColorHandler } from '../../interfaces';
 import props from '../../props';
 import { Color } from '../../utils';

src/color-picker/panel/linear-gradient.tsx

@@ -1,7 +1,7 @@
 import {
   computed, defineComponent, onBeforeUnmount, onMounted, reactive, ref, watch,
 } from '@vue/composition-api';
-import cloneDeep from 'lodash/cloneDeep';
+import { cloneDeep } from 'lodash-es';
 import { GRADIENT_SLIDER_DEFAULT_WIDTH } from '../../_common/js/color-picker/constants';
 import { genGradientPoint, gradientColors2string, GradientColorPoint } from '../utils';
 import { InputNumber as TInputNumber } from '../../input-number';

src/color-picker/panel/swatches.tsx

@@ -2,7 +2,7 @@ import {
   computed, defineComponent, PropType, ref,
 } from '@vue/composition-api';
 import { DeleteIcon as TdDeleteIcon, AddIcon as TdAddIcon } from 'tdesign-icons-vue';
-import cloneDeep from 'lodash/cloneDeep';
+import { cloneDeep } from 'lodash-es';
 import { Select as TSelect, Option as TOption } from '../../select';
 import { Color } from '../utils';
 import { useBaseClassName } from '../hooks';

src/config-provider/_example-composition/calendar.vue

@@ -6,7 +6,7 @@
 
 <script setup>
 import { ref } from 'vue';
-import merge from 'lodash/merge';
+import { merge } from 'lodash-es';
 import enConfig from 'tdesign-vue/es/locale/en_US';
 
 const MONTHS = [

src/config-provider/_example-composition/date-picker.vue

@@ -17,7 +17,7 @@
 
 <script setup>
 import { reactive } from 'vue';
-import merge from 'lodash/merge';
+import { merge } from 'lodash-es';
 import enConfig from 'tdesign-vue/es/locale/en_US';
 // import dayjs from 'dayjs';
 

src/config-provider/_example-composition/global.vue

@@ -12,7 +12,7 @@
 
 <script setup>
 import { ref } from 'vue';
-import merge from 'lodash/merge';
+import { merge } from 'lodash-es';
 import enConfig from 'tdesign-vue/es/locale/en_US';
 // 全局特性配置，引入英文语言配置包 enConfig
 const globalConfig = ref(

src/config-provider/_example-composition/others.vue

@@ -87,7 +87,7 @@ import { ref, reactive } from 'vue';
 import {
   ErrorIcon, ChevronRightIcon, CloseIcon, CloseCircleIcon,
 } from 'tdesign-icons-vue';
-import merge from 'lodash/merge';
+import { merge } from 'lodash-es';
 import enConfig from 'tdesign-vue/es/locale/en_US';
 
 const initialTransferList = [];

src/config-provider/_example-composition/pagination.vue

@@ -6,7 +6,7 @@
 
 <script setup>
 import { ref } from 'vue';
-import merge from 'lodash/merge';
+import { merge } from 'lodash-es';
 import enConfig from 'tdesign-vue/es/locale/en_US';
 
 const current = ref(1);

src/config-provider/_example-composition/table.vue

@@ -13,7 +13,7 @@
 <script setup lang="jsx">
 import { ref } from 'vue';
 import { ChevronRightIcon, CaretDownSmallIcon /** , ChevronDownIcon */ } from 'tdesign-icons-vue';
-import merge from 'lodash/merge';
+import { merge } from 'lodash-es';
 import enConfig from 'tdesign-vue/es/locale/en_US';
 
 const initialColumns = [

src/config-provider/_example/calendar.vue

@@ -5,7 +5,7 @@
 </template>
 
 <script>
-import merge from 'lodash/merge';
+import { merge } from 'lodash-es';
 import enConfig from 'tdesign-vue/es/locale/en_US';
 
 const MONTHS = [

src/config-provider/_example/date-picker.vue

@@ -16,7 +16,7 @@
 </template>
 
 <script>
-import merge from 'lodash/merge';
+import { merge } from 'lodash-es';
 import enConfig from 'tdesign-vue/es/locale/en_US';
 // import dayjs from 'dayjs';
 

src/config-provider/_example/global.vue

@@ -11,7 +11,7 @@
 </template>
 
 <script>
-import merge from 'lodash/merge';
+import { merge } from 'lodash-es';
 import enConfig from 'tdesign-vue/es/locale/en_US';
 
 export default {

src/config-provider/_example/others.vue

@@ -86,7 +86,7 @@
 import {
   ErrorIcon, ChevronRightIcon, CloseIcon, CloseCircleIcon,
 } from 'tdesign-icons-vue';
-import merge from 'lodash/merge';
+import { merge } from 'lodash-es';
 import enConfig from 'tdesign-vue/es/locale/en_US';
 
 const initialTransferList = [];

src/config-provider/_example/pagination.vue

@@ -5,7 +5,7 @@
 </template>
 
 <script>
-import merge from 'lodash/merge';
+import { merge } from 'lodash-es';
 import enConfig from 'tdesign-vue/es/locale/en_US';
 
 export default {

src/config-provider/_example/table.vue

@@ -12,7 +12,7 @@
 
 <script lang="jsx">
 import { ChevronRightIcon, CaretDownSmallIcon /** , ChevronDownIcon */ } from 'tdesign-icons-vue';
-import merge from 'lodash/merge';
+import { merge } from 'lodash-es';
 import enConfig from 'tdesign-vue/es/locale/en_US';
 
 const initialColumns = [

src/config-provider/config-provider.tsx

@@ -1,5 +1,5 @@
 import Vue, { PropType, VNode } from 'vue';
-import cloneDeep from 'lodash/cloneDeep';
+import { cloneDeep } from 'lodash-es';
 import { GlobalConfigProvider } from './type';
 import { defaultGlobalConfig, mergeWith } from './context';