Vue项目Jest单元测试报Unexpected token错误，无明确错误标识

问题定位步骤 #

因为错误栈未直接指向具体组件，先按以下方法锁定问题文件：

• 单独运行单个测试文件：执行jest 路径/到/你的测试文件.spec.js，逐个排查触发错误的测试，找到对应的组件。
• 定位组件后，查看模板第9行（错误提示(9:80)）附近代码，检查是否使用了?.（可选链）、??（空值合并）这类ES2020+语法——旧版vue-jest依赖的buble编译器不支持这些新语法，是触发该错误的常见原因。

具体解决方案 #

方案1：升级vue-jest（推荐） #

旧版vue-jest依赖的buble对新ES语法支持有限，升级到适配Vue版本的最新测试编译器：

• Vue2项目：卸载旧vue-jest，安装@vue/vue2-jest

  npm uninstall vue-jest
  npm install --save-dev @vue/vue2-jest
  

  同时更新Jest配置中的transform规则：

  transform: {
    '^.+\\.vue$': '@vue/vue2-jest',
    // 其余transform规则保持不变
  }
  

• Vue3项目：安装@vue/vue3-jest，配置逻辑同理。

方案2：替换模板中的不兼容语法 #

若暂时无法升级依赖，将组件模板里的新语法改为兼容写法：

• 把a?.b替换为a && a.b
• 把a ?? b替换为a != null ? a : b

方案3：调整第三方依赖转译配置 #

如果错误来自第三方组件库，将该库加入transformIgnorePatterns的例外列表，让Jest对其进行转译：

transformIgnorePatterns: ['node_modules/(?!bootstrap|你的第三方库名)'],

内容的提问来源于stack exchange，提问作者kowalski