【问题标题】:Vue/Typescript/Jest - Jest Unit Test SyntaxError: Unexpected token importVue/Typescript/Jest - Jest 单元测试语法错误:意外的令牌导入
【发布时间】:2019-03-27 18:14:59
【问题描述】:

我正在运行一个 Vue/Typescript/Vuetify 项目(使用 vue cli 3 创建)。对于单元测试,我使用的是 Jest。我升级到了更新版本的 Vuetify(1.3.1)。自升级以来,我在运行 Jest 测试时遇到错误:

location_to_project\node_modules\vuetify\lib\index.js:1
    ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import Vuetify from './components/Vuetify';
                                                                                        ^^^^^^
   SyntaxError: Unexpected token import

      1 | import Vue from 'vue'
      2 | // @ts-ignore
    > 3 | import Vuetify from 'vuetify/lib'
        | ^
      4 | import 'vuetify/src/stylus/app.styl'
      5 |
      6 | Vue.use(Vuetify, {

      at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/script_transformer.js:4    7)
03:17)
      at Object.<anonymous> (src/plugins/vuetify.ts:3:1)

版本和环境

Vuetify: 1.3.0 Vue: 2.5.17

曾在:

Vuetify: 1.2.10 Vue: 2.5.17

babel.config.js

module.exports = {
  presets: [
        [
            "@vue/app",
            {
                useBuiltIns: "entry"
            }
    ],
  ],
};

tsConfig 编译器:

"target": "esnext"

"module": "esnext"

【问题讨论】:

  • 当我在版本 1.1.13 中尝试按照您的方式导入时,我遇到了同样的错误。我不知道为什么这以前曾经奏效过。

标签: typescript vue.js jestjs vuetify.js babel-jest


【解决方案1】:

我遇到了同样的问题。
但是,我可以通过以下解决方法。

import Vuetify from 'vuetify'

只需删除“/lib”

【讨论】:

  • 当我听从你的建议时,我摆脱了关于那条线的错误。但是,在下一行检测到错误:import 'vuetify/src/stylus/app.styl'。此外,在 Vuetify 包中进行更改有点可怕......
  • 为什么需要导入样式(比如css)?删除它怎么样?
  • 谢谢!我找到了问题的根源:我正在测试的组件从main.js 导入了一个事件总线,而正是 在这个main.js 文件中 中的 Vuetify 导入导致了问题。我重组了我的代码,使组件不再从main.js 导入
【解决方案2】:

我遇到了类似(奇怪)的问题。在this 线程中找到了答案。

解决方案是运行

npx jest --clearCache

然后测试就开始了。

【讨论】:

    猜你喜欢
    • 2021-10-25
    • 2019-06-29
    • 1970-01-01
    • 2018-12-10
    • 2019-09-26
    • 2017-03-24
    • 2018-01-21
    • 1970-01-01
    • 2020-02-04
    相关资源
    最近更新 更多