vue3 vue.config.js 配置babel 解决浏览器版本过低报错

要在 Vue3 中配置 babel，首先需要安装 `@vue/cli-plugin-babel` 插件。可以通过以下命令安装：

npm install -D @vue/cli-plugin-babel

安装完成后，在项目根目录下创建 `vue.config.js` 文件，并添加以下配置：

module.exports = {
  transpileDependencies: [
    'my-dep', // 将需要转译的依赖名称添加到此处
  ],
  // 配置babel-loader选项
  chainWebpack: config => {
    config.module
      .rule('js')
      .exclude
      .add(file => /node_modules/.test(file) && !/\.vue\.js/.test(file))
      .end()
      .use('babel-loader')
      .loader('babel-loader')
      .tap(options => {
        // 修改官方默认配置，兼容 IE11
        options.presets = ['@babel/preset-env'];
        options.plugins = ['@babel/plugin-transform-runtime'];
        return options;
      });
  }
};

以上配置中，`transpileDependencies` 选项用于指定需要被 babel 转译的依赖。如果你的项目中使用了某些依赖，在低版本浏览器中出现了报错，可以将这些依赖的名称添加到此处。

`chainWebpack` 选项则是用于配置 `babel-loader` 的相关选项，将其修改为兼容 IE11 的配置。