javascript - 使用 Vue Js 运行 Jest 测试时出现 "SyntaxError: Cannot use import statement outside a module"

Question

我按照本教程 https://frontstuff.io/build-your-first-vue-js-component构建一个 vue js 组件。
然后我按照本教程 https://frontstuff.io/unit-test-your-first-vuejs-component对组件进行单元测试。
单元测试在组件上的 import 语句处失败并返回此错误:

● Test suite failed to run

C:\Users\SHINIGAMI-ALFSABAH\Documents\Workspace\Dev\Vue\star-rating\node_modules\vue-awesome\icons\star.js:1
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import Icon from '../components/Icon.vue'
                                                                                         ^^^^^^

SyntaxError: Cannot use import statement outside a module

  12 | 
  13 | <script>
> 14 |     import 'vue-awesome/icons/star'
     | ^
  15 |     import Icon from 'vue-awesome/components/Icon'
  16 | 
  17 |     export default {

  at ScriptTransformer._transformAndBuildScript (node_modules/@jest/transform/build/ScriptTransformer.js:537:17)
  at ScriptTransformer.transform (node_modules/@jest/transform/build/ScriptTransformer.js:579:25)
  at src/components/Rating.vue:14:1
  at Object.<anonymous> (src/components/Rating.vue:67:3)

任何帮助将不胜感激。

Answer 1

我从之前的类似问题 Unexpected token 'import' error while running Jest tests? 中找到了关于 SO 的答案

基本上我不得不在我的 Jest 配置中更改我的 transformIgnorePatterns 数组:
transformIgnorePatterns: ["/node_modules/"],
至
transformIgnorePatterns: ["/node_modules/(?!vue-awesome)"],
确保 jest 编译“vue-awesome”模块以在测试中使用。