在 vite 项目中，构建目标通过 `vite.config.js` 中的 build.target 选项进行配置。设置该属性为具体的浏览器版本字符串（如 'es2015'）或数组，vite 会自动利用 esbuild 将代码转译为兼容这些环境的语法，并移除未使用的 polyfill。
如何配置 build.target 以支持特定浏览器？
直接修改配置文件中的 build.target 字段即可生效。默认情况下，Vite 的目标是 'modules'，仅针对支持原生 ES 模块的现代浏览器。若需支持旧版浏览器，可将其改为 'es2015' 或更低的版本，此时 Vite 会启用完整的转译流程。
import { defineConfig } from 'vite';
export default defineConfig({
build: {
target: 'es2015',
},
});
运行 npx vite build 后，生成的 dist 目录下的 JS 文件将包含必要的语法转换，例如将可选链操作符转换为传统逻辑判断，确保在 IE11 之外的较旧环境中运行。
配置 target 对 Polyfill 和代码体积有何影响？
降低 build.target 的值会导致 Vite 引入更多的 Polyfill 并增加代码体积。Vite 依赖 @vitejs/plugin-legacy 来处理旧浏览器的兼容性，而 build.target 决定了哪些特性需要被转译。如果目标设为 'esnext'，则几乎不进行任何转译，代码保持最新语法，但无法在非现代浏览器中运行。
import { defineConfig } from 'vite';
import legacy from '@vitejs/plugin-legacy';
export default defineConfig({
plugins: [legacy()],
build: {
target: ['es2015', 'edge88', 'firefox78', 'chrome87', 'safari14'],
},
});
当使用数组形式指定多个目标时，Vite 会根据最低共同分母进行转译。配合 @vitejs/plugin-legacy，可以为不支持 ES 模块的旧浏览器生成单独的 legacy 包，从而实现渐进式增强。这种配置下，现代浏览器加载较小的原生 ES 模块，而旧浏览器加载经过完整转译和 Polyfill 注入的脚本。
如果 build.target 设置为 esnext 会发生什么？
当 build.target 设置为 'esnext' 时，Vite 假设运行环境完全支持最新的 JavaScript 特性，因此不会执行任何语法转译。这意味着代码中的新语法（如空值合并运算符、类字段等）将原样输出到构建产物中。这种做法能显著减小打包体积并提升构建速度，但前提是部署目标必须是支持这些特性的现代浏览器环境。
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
