Webpack 5 usage with imagemin and imagemin-svgo for .svg and .gif emits errors: Expected a 'string', got 'object'

[Dmitriy-Frostoff]

Whatsapp!) 👋
I've got a few of exceptions Expected a 'string', got 'object' via imagemin v9.0.0 and imagemin-svgo v11.0.0 usage with Webpack 5 v5.91.0...

What were you expecting to happen?

I expected to get the minimized .svg and .gif files.

What actually happened?

I got 12 errors with main trouble consisting of Expected a 'string', got 'object'.

Please give us a sample of your webpack.config.js

My entire boilerplates are at:

• boilerplate-webpack-gulp-html-scss-js-components
• boilerplate-webpack-gulp-html-scss-ts-components

The webpack.config.(js|ts) are at (cwd relative)
configs/webpack/webpack.config.(js|ts).

Terminal output / screenshots

The full log emited by Webpack 5 v5.91.0 via production mode bundle (development one works smoothly)

      $ npm run build
  > [email protected] build
  > webpack --config ./configs/webpack/webpack.config.js --node-env=production --progress

  assets by status 79.2 KiB [cached] 6 assets
  Entrypoint main = main.03f8.css main.3b77.js 2 auxiliary assets
  orphan modules 41.6 KiB (javascript) 997 bytes (runtime) [orphan] 11 modules
  cacheable modules 952 bytes (javascript) 8.23 KiB (css/mini-extract)
    ./projectName/src/index.js + 1 modules 952 bytes [built] [code generated]
    css ./node_modules/css-loader/dist/cjs.js!./node_modules/resolve-url-loader/index.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[2]
  .use[3]!./projectName/src/app/styles/index.scss 8.23 KiB [built] [code generated]

  ERROR in Error with 'src/shared/assets/images/svg/footer/_active/rs_school_js_active.2503.svg': Expected a `string`, got `object`

  ERROR in Error with 'src/shared/assets/images/svg/footer/rs_school_js.e17f.svg': Expected a `string`, got `object`

  ERROR in Error with 'src/shared/assets/images/gif/github.30ae.gif': Expected a `string`, got `object`

  ERROR in   Error: Child compilation failed:
    Module Error (from ./node_modules/image-minimizer-webpack-plugin/dist/loader.js):
    Error with 'E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\projectName\src\shared\assets\images\gif\github.gif': Expected a `
    string`, got `object`
    ModuleError: Module Error (from ./node_modules/image-minimizer-webpack-plugin/dist/loader.js):
    Error with 'E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\projectName\src\shared\assets\images\gif\github.gif': Expected a `
    string`, got `object`
        at Object.emitError (E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\node_modules\webpack\lib\NormalModule.js:669:6)
        at Object.loader (E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\node_modules\image-minimizer-webpack-plugin\dist\loader.
    js:159:12)
        at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    Module Error (from ./node_modules/image-minimizer-webpack-plugin/dist/loader.js):
    Error with 'E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\projectName\src\shared\assets\images\svg\footer\_active\github log
    o_active.svg': Expected a `string`, got `object`
    ModuleError: Module Error (from ./node_modules/image-minimizer-webpack-plugin/dist/loader.js):
    Error with 'E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\projectName\src\shared\assets\images\svg\footer\_active\github log
    o_active.svg': Expected a `string`, got `object`
        at Object.emitError (E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\node_modules\webpack\lib\NormalModule.js:669:6)
        at Object.loader (E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\node_modules\image-minimizer-webpack-plugin\dist\loader.
    js:159:12)
    Module Error (from ./node_modules/image-minimizer-webpack-plugin/dist/loader.js):
    Error with 'E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\projectName\src\shared\assets\images\svg\footer\_active\rs_school_
    js_active.svg': Expected a `string`, got `object`
    ModuleError: Module Error (from ./node_modules/image-minimizer-webpack-plugin/dist/loader.js):
    Error with 'E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\projectName\src\shared\assets\images\svg\footer\_active\rs_school_
    js_active.svg': Expected a `string`, got `object`
        at Object.emitError (E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\node_modules\webpack\lib\NormalModule.js:669:6)
        at Object.loader (E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\node_modules\image-minimizer-webpack-plugin\dist\loader.
    js:159:12)
    Module Error (from ./node_modules/image-minimizer-webpack-plugin/dist/loader.js):
    Error with 'E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\projectName\src\shared\assets\images\svg\footer\github logo.svg':
    Expected a `string`, got `object`
    ModuleError: Module Error (from ./node_modules/image-minimizer-webpack-plugin/dist/loader.js):
    Error with 'E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\projectName\src\shared\assets\images\svg\footer\github logo.svg':
    Expected a `string`, got `object`
        at Object.emitError (E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\node_modules\webpack\lib\NormalModule.js:669:6)
        at Object.loader (E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\node_modules\image-minimizer-webpack-plugin\dist\loader.
    js:159:12)
    Module Error (from ./node_modules/image-minimizer-webpack-plugin/dist/loader.js):
    Error with 'E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\projectName\src\shared\assets\images\svg\footer\rs_school_js.svg':
    Expected a `string`, got `object`
    ModuleError: Module Error (from ./node_modules/image-minimizer-webpack-plugin/dist/loader.js):
    Error with 'E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\projectName\src\shared\assets\images\svg\footer\rs_school_js.svg':
    Expected a `string`, got `object`
        at Object.emitError (E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\node_modules\webpack\lib\NormalModule.js:669:6)
        at Object.loader (E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\node_modules\image-minimizer-webpack-plugin\dist\loader.
    js:159:12)
    Error with 'src/shared/assets/images/svg/footer/_active/rs_school_js_active.2503.svg': Expected a `string`, got `object`
    Error: Error with 'src/shared/assets/images/svg/footer/_active/rs_school_js_active.2503.svg': Expected a `string`, got `object`
        at Object.imageminMinify [as implementation] (E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\node_modules\image-minimizer
    -webpack-plugin\dist\utils.js:576:22)
        at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
        at async worker (E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\node_modules\image-minimizer-webpack-plugin\dist\worker.j
    s:76:25)
        at async E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\node_modules\image-minimizer-webpack-plugin\dist\index.js:326:18
    Error with 'src/shared/assets/images/svg/footer/rs_school_js.e17f.svg': Expected a `string`, got `object`
    Error: Error with 'src/shared/assets/images/svg/footer/rs_school_js.e17f.svg': Expected a `string`, got `object`
        at Object.imageminMinify [as implementation] (E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\node_modules\image-minimizer
    -webpack-plugin\dist\utils.js:576:22)
        at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
        at async worker (E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\node_modules\image-minimizer-webpack-plugin\dist\worker.j
    s:76:25)
        at async E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\node_modules\image-minimizer-webpack-plugin\dist\index.js:326:18
    Error with 'src/shared/assets/images/gif/github.30ae.gif': Expected a `string`, got `object`
    Error: Error with 'src/shared/assets/images/gif/github.30ae.gif': Expected a `string`, got `object`
        at Object.imageminMinify [as implementation] (E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\node_modules\image-minimizer
    -webpack-plugin\dist\utils.js:576:22)
        at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
        at async worker (E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\node_modules\image-minimizer-webpack-plugin\dist\worker.j
    s:76:25)
        at async E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\node_modules\image-minimizer-webpack-plugin\dist\index.js:326:18

    - NormalModule.js:669 Object.emitError
      [boilerplate-webpack-gulp-html-scss-js-components]/[webpack]/lib/NormalModule.js:669:6

    - loader.js:159 Object.loader
      [boilerplate-webpack-gulp-html-scss-js-components]/[image-minimizer-webpack-plugin]/dist/loader.js:159:12

    - task_queues:95 process.processTicksAndRejections
      node:internal/process/task_queues:95:5

    - Module Error (from ./node_modules/image-minimizer-webpack-plugin/dist/loader.js):

    - Error with 'E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\projectName\src\shared\assets\images\svg\footer\_active\github l
      ogo_active.svg': Expected a `string`, got `object`

    - ModuleError: Module Error (from ./node_modules/image-minimizer-webpack-plugin/dist/loader.js):

    - Error with 'E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\projectName\src\shared\assets\images\svg\footer\_active\github l
      ogo_active.svg': Expected a `string`, got `object`

    - NormalModule.js:669 Object.emitError
      [boilerplate-webpack-gulp-html-scss-js-components]/[webpack]/lib/NormalModule.js:669:6

    - loader.js:159 Object.loader
      [boilerplate-webpack-gulp-html-scss-js-components]/[image-minimizer-webpack-plugin]/dist/loader.js:159:12

    - Module Error (from ./node_modules/image-minimizer-webpack-plugin/dist/loader.js):

    - Error with 'E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\projectName\src\shared\assets\images\svg\footer\_active\rs_schoo
      l_js_active.svg': Expected a `string`, got `object`

    - ModuleError: Module Error (from ./node_modules/image-minimizer-webpack-plugin/dist/loader.js):

    - Error with 'E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\projectName\src\shared\assets\images\svg\footer\_active\rs_schoo
      l_js_active.svg': Expected a `string`, got `object`

    - NormalModule.js:669 Object.emitError
      [boilerplate-webpack-gulp-html-scss-js-components]/[webpack]/lib/NormalModule.js:669:6

    - loader.js:159 Object.loader
      [boilerplate-webpack-gulp-html-scss-js-components]/[image-minimizer-webpack-plugin]/dist/loader.js:159:12

    - Module Error (from ./node_modules/image-minimizer-webpack-plugin/dist/loader.js):

    - Error with 'E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\projectName\src\shared\assets\images\svg\footer\github logo.svg'
      : Expected a `string`, got `object`

    - ModuleError: Module Error (from ./node_modules/image-minimizer-webpack-plugin/dist/loader.js):

    - Error with 'E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\projectName\src\shared\assets\images\svg\footer\github logo.svg'
      : Expected a `string`, got `object`

    - NormalModule.js:669 Object.emitError
      [boilerplate-webpack-gulp-html-scss-js-components]/[webpack]/lib/NormalModule.js:669:6

    - loader.js:159 Object.loader
      [boilerplate-webpack-gulp-html-scss-js-components]/[image-minimizer-webpack-plugin]/dist/loader.js:159:12

    - Module Error (from ./node_modules/image-minimizer-webpack-plugin/dist/loader.js):

    - Error with 'E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\projectName\src\shared\assets\images\svg\footer\rs_school_js.svg
      ': Expected a `string`, got `object`

    - ModuleError: Module Error (from ./node_modules/image-minimizer-webpack-plugin/dist/loader.js):

    - Error with 'E:\Code learning\boilerplate-webpack-gulp-html-scss-js-components\projectName\src\shared\assets\images\svg\footer\rs_school_js.svg
      ': Expected a `string`, got `object`

    - NormalModule.js:669 Object.emitError
      [boilerplate-webpack-gulp-html-scss-js-components]/[webpack]/lib/NormalModule.js:669:6

    - loader.js:159 Object.loader
      [boilerplate-webpack-gulp-html-scss-js-components]/[image-minimizer-webpack-plugin]/dist/loader.js:159:12

    - Error with 'src/shared/assets/images/svg/footer/_active/rs_school_js_active.2503.svg': Expected a `string`, got `object`

    - Error: Error with 'src/shared/assets/images/svg/footer/_active/rs_school_js_active.2503.svg': Expected a `string`, got `object`

    - utils.js:576 Object.imageminMinify [as implementation]
      [boilerplate-webpack-gulp-html-scss-js-components]/[image-minimizer-webpack-plugin]/dist/utils.js:576:22

    - task_queues:95 process.processTicksAndRejections
      node:internal/process/task_queues:95:5

    - worker.js:76 async worker
      [boilerplate-webpack-gulp-html-scss-js-components]/[image-minimizer-webpack-plugin]/dist/worker.js:76:25

    - index.js:326
      [boilerplate-webpack-gulp-html-scss-js-components]/[image-minimizer-webpack-plugin]/dist/index.js:326:18

    - Error with 'src/shared/assets/images/svg/footer/rs_school_js.e17f.svg': Expected a `string`, got `object`

    - Error: Error with 'src/shared/assets/images/svg/footer/rs_school_js.e17f.svg': Expected a `string`, got `object`

    - utils.js:576 Object.imageminMinify [as implementation]
      [boilerplate-webpack-gulp-html-scss-js-components]/[image-minimizer-webpack-plugin]/dist/utils.js:576:22

    - task_queues:95 process.processTicksAndRejections
      node:internal/process/task_queues:95:5

    - worker.js:76 async worker
      [boilerplate-webpack-gulp-html-scss-js-components]/[image-minimizer-webpack-plugin]/dist/worker.js:76:25

    - index.js:326
      [boilerplate-webpack-gulp-html-scss-js-components]/[image-minimizer-webpack-plugin]/dist/index.js:326:18

    - Error with 'src/shared/assets/images/gif/github.30ae.gif': Expected a `string`, got `object`

    - Error: Error with 'src/shared/assets/images/gif/github.30ae.gif': Expected a `string`, got `object`

    - utils.js:576 Object.imageminMinify [as implementation]
      [boilerplate-webpack-gulp-html-scss-js-components]/[image-minimizer-webpack-plugin]/dist/utils.js:576:22

    - task_queues:95 process.processTicksAndRejections
      node:internal/process/task_queues:95:5

    - worker.js:76 async worker
      [boilerplate-webpack-gulp-html-scss-js-components]/[image-minimizer-webpack-plugin]/dist/worker.js:76:25

    - index.js:326
      [boilerplate-webpack-gulp-html-scss-js-components]/[image-minimizer-webpack-plugin]/dist/index.js:326:18

    - child-compiler.js:174
      [boilerplate-webpack-gulp-html-scss-js-components]/[html-webpack-plugin]/lib/child-compiler.js:174:18

    - Compiler.js:605 finalCallback
      [boilerplate-webpack-gulp-html-scss-js-components]/[webpack]/lib/Compiler.js:605:5

    - Compiler.js:640
      [boilerplate-webpack-gulp-html-scss-js-components]/[webpack]/lib/Compiler.js:640:11

    - Compiler.js:1329
      [boilerplate-webpack-gulp-html-scss-js-components]/[webpack]/lib/Compiler.js:1329:17


    - task_queues:95 process.processTicksAndRejections
      node:internal/process/task_queues:95:5

  

Please provide the following information:

OS & version [e.g. MacOS Catalina 10.15.4]: Windows 10 Pro v1803 (i.e. Windows 10 v10.0.17134)
node version (run node -v): v21.7.1
npm version (run npm -v): 10.7.0
Webpack version (run npx webpack -v): 5.91.0
imagemin version: 9.0.0
imagemin-svgo: 11.0.0

(more details via package.json s at
boilerplate-webpack-gulp-html-scss-js-components
and
boilerplate-webpack-gulp-html-scss-ts-components
)

Steps to reproduce:

• copy the boilerplate
• install the dependencies
• check out that the command

npm run html

works fine;

• remove imagemin and imagemin-svgo via

npm un imagemin imagemin-svgo

• install actual imagemin and imagemin-svgo packages via

npm i -D imagemin imagemin-svgo

• run

npm run build

Additional information

The exceptions are emitted only via actual imagemin v9.0.0 and imagemin-svgo v11.0.0 usage, previous ones work fine.
I hope it'll help to find the problem...

[denysdesign]

I have same errors after update :-(

[timmywil]

It's an issue with imagemin-svgo. See imagemin/imagemin-svgo#62. There a couple PRs that fix it that haven't been merged yet:

imagemin/imagemin-svgo#63
imagemin/imagemin-svgo#64