vite vue3配置babel

在 Vite 中，配置 Babel 非常简单。你只需要在 `vite.config.js` 文件中添加 `babel` 字段即可。

下面是一个示例配置：

// vite.config.js
export default {
  // ...其他配置项
  build: {
    target: 'es2015', // 设置构建目标为 ES2015，以支持更好的 Tree-Shaking
    lib: {
      entry: 'src/index.js',
      name: 'MyLib',
      fileName: (format) => `my-lib.${format}.js`
    },
    rollupOptions: {
      // 确保外部化处理那些你不想打包进库的依赖
      external: ['vue'],
      output: {
        // 在 UMD 构建模式下为这些外部化的依赖提供一个全局变量
        globals: {
          vue: 'Vue'
        }
      }
    },
    babel: {
      presets: [
        [
          '@babel/preset-env',
          {
            targets: 'defaults' // 按照浏览器默认配置进行转换
          }
        ]
      ],
      plugins: []
    }
  }
}

在上面的示例中，我们配置了 Babel 的 `preset-env` 插件来处理 ES6+ 语法，并且将目标浏览器设置为默认配置。你也可以根据自己的需要添加其他的 Babel 插件和配置。

注意，Vite 的构建默认会启用 `babel` 插件，因此无需单独安装。