vue jest test:unit 的时候:报可选链不识别问题解决

1,767 阅读1分钟

基于 @vue/cli@4.5 构建的 工程 | vue@2.x + typescript + jest

问题

// 跑 jest 单元测试的时候,总会报:
	this.xxx.xx?.xxx
SyntaxError: Unexpected token '.' 

// 修改成这样就没问题:
    this.xxx.xx&&this.xxx.xx.xxx

嗯,jest 跑的时候没有编译可选链?Optional chain ?

解决过程

直接去 vue-jestGitHub 里面搜索了一下发现:(https://github.com/vuejs/vue-jest/issues/200)
此问题处于 open 状态???
嗯... @babel/plugin-proposal-optional-chaining 直接放弃
去 jest 的 Github 里面碰碰运气,直接搜到 closed 的:
https://github.com/facebook/jest/issues/8973
完美!

解决方案:

// jest.config.js 中增加配置
globals: {
  'ts-jest': {
    tsConfig: {
      target: 'ES2019'
    }
  }
}

原因:

// ts.config.js 中配置是:
	target: "esnext"
而在 es2020 中,已经支持了可选链语法 ?. 
可以想到,jest 跑的时候,ts编译忽略了 ?. 这个语法,而在 jest 本身无法识别这个语法;
所以,要告诉 jest 把 ts 按 es2019 标准去编译