this webpack plugin should use ESM, or indicate incompatibility with ESM

[lizthegrey]

Modification Proposal

https://github.com/imagemin/imagemin-svgo/releases/tag/v10.0.0 requires all modules that import it to support ESM; while v9.0.0 continues to work fine, there should be something added to indicate that imagemin-svgo should not be upgraded until this package is upgraded to ESM as well.

Expected Behavior / Situation

SVG packing and optimization should happen correctly with imagemin-svgo.

Actual Behavior / Situation

Warnings and failed svg packing, because an ESM module cannot be loaded with require() from a cjs module.

WARNING in ./src/client/shared/res/LoadingSpinner-spinner.svg
Module Warning (from ./node_modules/image-minimizer-webpack-plugin/dist/loader.js):
Unknown plugin: imagemin-svgo

Did you forget to install the plugin?
You can install it with:

$ npm install imagemin-svgo --save-dev
$ yarn add imagemin-svgo --dev
 @ ./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[1]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[7].use[0]!./src/client/shared/LoadingSpinner.vue?vue&type=template&id=440c8cdd&scoped=true 2:0-57 27:21-31
 @ ./src/client/shared/LoadingSpinner.vue?vue&type=template&id=440c8cdd&scoped=true 1:0-232 1:0-232
 @ ./src/client/shared/LoadingSpinner.vue 1:0-87 6:16-22
 @ ./node_modules/ts-loader/index.js??clonedRuleSet-1!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[7].use[0]!./src/client/admin/AccountLog.vue?vue&type=script&lang=ts
 @ ./src/client/admin/AccountLog.vue?vue&type=script&lang=ts 1:0-202 1:0-202 1:203-394 1:203-394
 @ ./src/client/admin/AccountLog.vue 2:0-61 3:0-56 3:0-56 6:0-13 7:0-16 9:15-21
 @ ./src/client/home.ts

Please paste the results of npx webpack-cli info here, and mention other relevant information

yarn webpack-cli info
yarn run v1.22.5
$ /home/lizf/eve-roster/node_modules/.bin/webpack-cli info

  System:
    OS: Linux 5.11 Ubuntu 20.04.3 LTS (Focal Fossa)
    CPU: (12) x64 AMD Ryzen 5 5600X 6-Core Processor
    Memory: 1.27 GB / 31.29 GB
  Binaries:
    Node: 14.17.6 - /tmp/yarn--1632200084282-0.1678014881235168/node
    Yarn: 1.22.5 - /tmp/yarn--1632200084282-0.1678014881235168/yarn
  Browsers:
    Chrome: beta
    Firefox: 92.0
  Packages:
    clean-webpack-plugin: ^4.0.0 => 4.0.0 
    css-minimizer-webpack-plugin: ^3.0.2 => 3.0.2 
    html-webpack-plugin: ^5.3.2 => 5.3.2 
    html-webpack-pug-plugin: ^3.0.0 => 3.0.0 
    image-minimizer-webpack-plugin: ^2.2.0 => 2.2.0 
    moment-locales-webpack-plugin: ^1.2.0 => 1.2.0 
    terser-webpack-plugin: ^5.2.4 => 5.2.4 
    webpack: ^5.37.1 => 5.38.1 
    webpack-cli: ^4.8.0 => 4.8.0 
    webpack-dev-middleware: ^5.1.0 => 5.1.0 
    webpack-hot-middleware: webpack-contrib/webpack-hot-middleware#webpack5 => 2.25.0 
    webpack-merge: ^5.8.0 => 5.8.0 

Done in 0.36s.

[alexander-akait]

We can migrate on import()

[dKustura]

For people who are still getting the Unknown plugin error, even after upgrading and installing all needed packages, try to upgrade your webpack-cli dependency. This finally did it for me.

After catching the original error TypeError: Invalid host defined options it led me to this similar issue mentioned here.