using image resize library imagemin in vuejs throws error Cannot read property 'dirname' of undefined

Question

i'm trying to use the image resize library imagemin in vue.js but it's throwing me this error after i installed imagemin-mozjpeg. i have not started using it just importing it throws error. this is the error.

Uncaught TypeError: Cannot read property 'dirname' of undefined
    at eval (index.js?7f9a:4)
    at Object../node_modules/imagemin/node_modules/glob-parent/index.js (app.js:3705)
    at __webpack_require__ (app.js:727)
    at fn (app.js:101)
    at eval (pattern.js?7bc8:4)
    at Object../node_modules/imagemin/node_modules/fast-glob/out/utils/pattern.js (app.js:3669)
    at __webpack_require__ (app.js:727)
    at fn (app.js:101)
    at eval (index.js?61cd:11)
    at Object../node_modules/imagemin/node_modules/fast-glob/out/utils/index.js (app.js:3645)

this is my package json

"dependencies": {
    "bootstrap-vue": "^2.0.4",
    "firebase": "^7.2.3",
    "flatpickr": "^4.5.1",
    "imagemin": "^7.0.0",
    "imagemin-mozjpeg": "^8.0.0",
    "nouislider": "^11.1.0",
    "register-service-worker": "^1.5.2",
    "vue": "^2.6.6",
    "vue-flatpickr-component": "^8.1.1",
    "vue-lazyload": "^1.2.6",
    "vue-router": "^3.0.2",
    "vue2-transitions": "^0.2.3"
  },

this is how i'm importing it in my component

const imagemin = require('imagemin');
const imageminMozjpeg = require('imagemin-mozjpeg');