Vite构建报错：Uncaught SyntaxError: Unexpected token 'export' 求助

常见原因 #

• 第三方依赖库使用了未转译的ES模块语法，Vite默认不会对node_modules目录下的包进行转译，导致浏览器无法识别export关键字
• 项目配置中未正确处理ES模块与CommonJS模块的兼容性，部分文件被错误解析为CommonJS格式，却使用了ES模块的导出语法
• 依赖库本身存在语法混用问题，同时使用了ES模块和CommonJS的导出方式，导致打包后代码冲突

解决方法 #

• 指定需要转译的依赖：在vite.config.js中配置optimizeDeps或build.commonjsOptions，让Vite对特定依赖进行转译处理。示例配置：

import { defineConfig } from 'vite'

export default defineConfig({
  optimizeDeps: {
    // 填入出现问题的依赖包名
    include: ['problem-package']
  },
  build: {
    commonjsOptions: {
      include: /node_modules/
    }
  }
})

• 检查文件语法一致性：确认项目中的文件要么统一使用ES模块（import/export），要么使用CommonJS（require/module.exports），避免在同一个文件中混用两种语法
• 更换依赖版本或替代库：如果是依赖库本身的兼容性问题，尝试升级/降级到稳定版本，或者寻找功能类似的兼容Vite的替代库

内容的提问来源于stack exchange，提问作者Vergel Mañalac