diff --git a/package.json b/package.json
index f1a7e09..9711278 100644
--- a/package.json
+++ b/package.json
@@ -43,11 +43,11 @@
     "publish:next": "npm run build && npm publish --tag next"
   },
   "peerDependencies": {
-    "vue": "^3.0.0",
-    "viewerjs": "^1.11.0"
+    "viewerjs": "^1.11.0",
+    "vue": "^3.0.0"
   },
   "dependencies": {
-    "lodash": "^4.17.21"
+    "lodash-es": "^4.17.21"
   },
   "devDependencies": {
     "@antfu/eslint-config": "^0.27.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 3b4546d..46fa6e5 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -5,7 +5,7 @@ settings:
   excludeLinksFromLockfile: false
 
 dependencies:
-  lodash:
+  lodash-es:
     specifier: ^4.17.21
     version: 4.17.21
   viewerjs:
@@ -3162,6 +3162,10 @@ packages:
       p-locate: 5.0.0
     dev: true
 
+  /lodash-es@4.17.21:
+    resolution: {integrity: sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==}
+    dev: false
+
   /lodash.camelcase@4.3.0:
     resolution: {integrity: sha512-TwuEnCnxbc3rAvhf/LbG7tJUDzhqXyFnv3dtzLOPgCG/hODL7WFnsbwktkD7yUV0RrreP/l1PALq/YSg6VvjlA==}
     dev: true
@@ -3204,6 +3208,7 @@ packages:
 
   /lodash@4.17.21:
     resolution: {integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==}
+    dev: true
 
   /log-update@4.0.0:
     resolution: {integrity: sha512-9fkkDevMefjg0mmzWFBW8YkFP91OrizzkW3diF7CpG+S2EYdy4+TVfGwz1zeF8x7hCx1ovSPTOE9Ngib74qqUg==}
diff --git a/src/api.ts b/src/api.ts
index aed8a43..460c63f 100644
--- a/src/api.ts
+++ b/src/api.ts
@@ -1,6 +1,6 @@
 import { h, render } from 'vue'
 import Viewer from 'viewerjs'
-import { assign } from './util'
+import { assign } from 'lodash-es'
 
 export interface ViewerApiOptions {
   images: Array<string | object>
diff --git a/src/directive.ts b/src/directive.ts
index 47418cb..7a3e9a7 100644
--- a/src/directive.ts
+++ b/src/directive.ts
@@ -1,5 +1,5 @@
 import Viewer from 'viewerjs'
-import debounce from 'lodash/debounce'
+import { debounce } from 'lodash-es'
 import { nextTick, watch } from 'vue'
 import type { Directive, DirectiveBinding, VNode } from 'vue'
 
diff --git a/src/index.ts b/src/index.ts
index d2d2958..7946fca 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,5 +1,5 @@
 import type { App } from 'vue'
-import defaults from 'lodash/defaults'
+import { defaults } from 'lodash-es'
 import Viewer from 'viewerjs'
 import api from './api'
 import directive from './directive'
diff --git a/src/util.ts b/src/util.ts
deleted file mode 100755
index 0d6c6e0..0000000
--- a/src/util.ts
+++ /dev/null
@@ -1,127 +0,0 @@
-export const inBrowser = typeof window !== 'undefined' && window !== null
-
-export const hasIntersectionObserver = checkIntersectionObserver()
-const isEnumerable = Object.prototype.propertyIsEnumerable
-const getSymbols = Object.getOwnPropertySymbols
-
-/**
- * is object
- *
- * @param {*} val
- * @returns {boolean}
- */
-export function isObject(val: any): boolean {
-  return typeof val === 'function' || toString.call(val) === '[object Object]'
-}
-
-/**
- * is primitive
- *
- * @param {*} val
- * @returns {boolean}
- */
-export function isPrimitive(val: any): boolean {
-  return typeof val === 'object' ? val === null : typeof val !== 'function'
-}
-
-/**
- * check private key
- *
- * @export
- * @param {*} key
- * @returns {boolean}
- */
-export function isValidKey(key: any): boolean {
-  return key !== '__proto__' && key !== 'constructor' && key !== 'prototype'
-}
-
-/**
- * Check if IntersectionObserver can be used
- *
- * @returns {boolean}
- */
-export function checkIntersectionObserver(): boolean {
-  if (inBrowser
-    && 'IntersectionObserver' in window
-    && 'IntersectionObserverEntry' in window
-    && 'intersectionRatio' in window.IntersectionObserverEntry.prototype) {
-    // Minimal polyfill for Edge 15's lack of `isIntersecting`
-    // See: https://github.com/w3c/IntersectionObserver/issues/211
-    if (!('isIntersecting' in window.IntersectionObserverEntry.prototype)) {
-      Object.defineProperty(window.IntersectionObserverEntry.prototype,
-        'isIntersecting', {
-          get() {
-            return this.intersectionRatio > 0
-          },
-        })
-    }
-    return true
-  }
-  return false
-}
-
-/**
- * Assign the enumerable es6 Symbol properties from one
- * or more objects to the first object passed on the arguments.
- * Can be used as a supplement to other extend, assign or
- * merge methods as a polyfill for the Symbols part of
- * the es6 Object.assign method.
- * https://github.com/jonschlinkert/assign-symbols
- *
- * @param {*} target
- * @param {...any[]} args
- * @returns
- */
-function assignSymbols(target: any, ...args: any[]) {
-  if (!isObject(target)) {
-    throw new TypeError('expected the first argument to be an object')
-  }
-
-  if (args.length === 0 || typeof Symbol !== 'function' || typeof getSymbols !== 'function') {
-    return target
-  }
-
-  for (const arg of args) {
-    const names = getSymbols(arg)
-
-    for (const key of names) {
-      if (isEnumerable.call(arg, key)) {
-        target[key] = arg[key]
-      }
-    }
-  }
-  return target
-}
-
-/**
- * Deeply assign the values of all enumerable-own-properties and symbols
- * from one or more source objects to a target object. Returns the target object.
- * https://github.com/jonschlinkert/assign-deep
- *
- * @param {*} target
- * @param {...any[]} args
- * @returns
- */
-export function assign(target: any, ...args: any[]): any {
-  let i = 0
-  if (isPrimitive(target))
-    target = args[i++]
-  if (!target)
-    target = {}
-  for (; i < args.length; i++) {
-    if (isObject(args[i])) {
-      for (const key of Object.keys(args[i])) {
-        if (isValidKey(key)) {
-          if (isObject(target[key]) && isObject(args[i][key])) {
-            assign(target[key], args[i][key])
-          }
-          else {
-            target[key] = args[i][key]
-          }
-        }
-      }
-      assignSymbols(target, args[i])
-    }
-  }
-  return target
-}