webpack打包ES6+语法及?.等可选链式操作符的问题

问题背景：在开发时往往会追求最新语法，但是在使用webpack打包时，可能存在无法检测到这种语法并转换为es5语法这类问题，从而导致部署之后项目报错等问题。

 

1.首先需要保证babel-loader依赖项已更新到最新版本，以便在编译过程中将其转换为 ES5 代码。

2.可以在 package.json 文件中的 babel-loader 依赖项中指定所需的 babel 插件和预设版本。

如：

"babel-loader": "^8.0.0",
"@babel/core": "^7.0.0",
"@babel/preset-env": "^7.0.0",
"@babel/plugin-proposal-optional-chaining": "^7.0.0"

这些依赖项将启用 babel 转换器，并配置 babel 转换器以将可选链式操作符转换为 ES5 代码。您还需要在 .babelrc 文件中添加以下配置：

{
  "presets": [
    "@babel/preset-env"
  ],
  "plugins": [
    "@babel/plugin-proposal-optional-chaining"
  ]
}

这些配置将启用 @babel/preset-env 预设，该预设将将您的 ES6+ 代码转换为 ES5 代码，并启用 @babel/plugin-proposal-optional-chaining 插件以将可选链式操作符转换为 ES5 代码。