ReactJS项目webpack-cli报TypeError：presetToOptions未定义

这个错误我帮人排查过好多次，核心原因就是Webpack 2.x版本太老，和新版Babel工具链不兼容导致的。下面给你一步步的解决办法：

1. 降级适配的Babel依赖包 #

Webpack 2.7.0只能搭配babel-loader 7.x版本（8+版本对应Webpack 4+），而babel-loader 7.x又依赖Babel 6.x生态的包。先卸载可能不兼容的新版Babel包：

npm uninstall babel-loader @babel/core @babel/preset-env

然后安装完全适配的稳定版本：

npm install babel-loader@7.1.5 babel-core@6.26.3 babel-preset-env@1.7.0 --save-dev

2. 修正Babel配置文件 #

确保你的.babelrc（或babel.config.js）用的是Babel 6.x的语法，不要用@babel/preset-env这类Babel 7+的包，示例配置如下：

{
  "presets": [
    ["env", {
      "targets": {
        "browsers": ["last 2 versions", "ie >= 9"]
      }
    }]
  ]
}

3. 检查Webpack配置中的Loader规则 #

打开你的webpack.config.js，确认babel-loader的配置没有引用错误的包，示例配置：

module.exports = {
  // 其他配置项...
  module: {
    rules: [
      {
        test: /\.jsx?$/, // 匹配JS/JSX文件
        exclude: /node_modules/,
        use: 'babel-loader' // 配置放在.babelrc里更清晰，避免重复冲突
      }
    ]
  }
};

4. 清理缓存重新安装依赖 #

有时候node_modules里的缓存文件会导致奇怪的版本冲突，建议彻底清理后重装：

• Windows系统：

  rd /s /q node_modules
  del package-lock.json
  npm install
  

• 类Unix系统（Mac/Linux）：

  rm -rf node_modules
  rm package-lock.json
  npm install
  

做完这些步骤后，再运行webpack命令，应该就能解决这个错误了。

内容的提问来源于stack exchange，提问作者aman jain