Webpack build error. Invalid configuration object. Invalid target param

Question

Have this code in config-overrides.js

const rewireReactHotLoader = require('react-app-rewire-hot-loader')

module.exports = function override(config, env) {
  config = rewireReactHotLoader(config, env)
  config.target = 'es2020'
  config.resolve.alias = {
    ...config.resolve.alias,
    'react-dom': '@hot-loader/react-dom',
    hpscm: 'src/apps/hpscm',
    lut: 'src/apps/lut/src/apps/lut',
    shared: 'src/apps/lut/src/apps/shared',
    search: 'src/apps/search/src/apps/search',
    kbase: 'src/apps/kbase/src/apps/kbase',
    docflow: 'src/apps/docflow/src/apps/docflow',
  }

  return config
}

Got this error:

Failed to compile.

Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
 - configuration.target should be one of these:
   "web" | "webworker" | "node" | "async-node" | "node-webkit" | "electron-main" | "electron-renderer" | "electron-preload" | function
   -> Environment to build for
   Details:
    * configuration.target should be one of these:
      "web" | "webworker" | "node" | "async-node" | "node-webkit" | "electron-main" | "electron-renderer" | "electron-preload"
    * configuration.target should be an instance of function

Have also checked this question configuration.module has an unknown property 'loaders'

I don't have "loaders" in my config, only "rules". Couldn't find any solution. Have somebody also ran into this issue?

Answer 1

Need to update version of webpack to set target as es2020 https://webpack.js.org/configuration/target/