我按照本教程https://frontstuff.io/build-your-first-vue-js-component构建了一个vue js组件.

● 测试套件无法运行

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)

任何帮助都将不胜感激.

推荐答案

I found an answer on SO from a previous similar question Unexpected 到ken 'import' error while running Jest tests?

基本上,我必须在jest配置中更改transformIgnorePatterns数组,从:

transformIgnorePatterns: ["/node_modules/"],

transformIgnorePatterns: ["/node_modules/(?!vue-awesome)"],

making sure jest compiles 'vue-awesome' module 到 use in the test.

Vue.js相关问答推荐

Nuxt3 Build . put文件夹保持空,没有从.nuxt复制任何内容

Vue CDN的html工作,但v—如果不工作

如何将外部 svg 转换为 Vue3 组件?

在 onMounted 之前渲染的 Vue 模板

仅在构建时为 Vue3 和 TailwindCSS 添加前缀

使用 Vue.js 清除数组内容和react性问题

两个div元素之间的vue2过渡

VuetifyJS,outer-link 未显示为光标

VueJS:为什么在input事件处理程序中触发Input输入事件?

使用 Vue Router 设置页面标题

Polyfill for ie

VueJS 组件中的图像未加载

使用 Vue.js (cdn) 在特定元素上切换显示/隐藏

使用 vue-test-utils 配置过滤器

如何使用 vue.js 获取所选选项的索引

带有子菜单的 Vuetify 导航抽屉

为 webpack HMR Vue.js 包含来自外部项目文件夹的可导入模块

我可以修改 Vue.js VNodes 吗?

Vuetify - 如何进行分页?

居中 v-toolbar-title