Vue/Typescript/Jest - Jest Unit Test SyntaxError: Unexpected token import

Question

I am running a Vue/Typescript/Vuetify project(Created with vue cli 3). For unit testing I am using Jest. I upgraded to a newer version of Vuetify(1.3.1). Since the upgrade I get an error when running my Jest tests:

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)

Versions and Environment

Vuetify: 1.3.0 Vue: 2.5.17

Previously worked in:

Vuetify: 1.2.10 Vue: 2.5.17

babel.config.js

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

tsConfig Compiler:

"target": "esnext"

"module": "esnext"

I get the same error when I try the import your way in version 1.1.13. I'm not sure why this had ever worked before. — petey
– petey, Commented Oct 23, 2018 at 13:28

harufumi.abe · Accepted Answer · 2018-11-27 08:43:59Z

3

I encountered same problem.
but, I could workaround by below.

import Vuetify from 'vuetify'

just remove "/lib"

answered Nov 27, 2018 at 8:43

harufumi.abe

8579 silver badges8 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Eerik Sven Puudist Over a year ago

When I followed your advice, I got rid of the error regarding that line. However, an error was detected on the next line: import 'vuetify/src/stylus/app.styl'. Also, it seams a bit scary to make changes in Vuetify package...

harufumi.abe Over a year ago

Why do you need to import style(like css)? How about removing it?

Eerik Sven Puudist Over a year ago

Thank you! I found the root of the problem: the component, which I was testing, imported an event bus from main.js and it was the Vuetify import in this main.js file, which created the problem. I restructured my code so that the component does not import from main.js any more

ierdna · Accepted Answer · 2018-12-06 02:10:53Z

0

I had a similar (odd) issue. Found an answer in this thread.

The solution was to run

npx jest --clearCache

and the tests worked after that.

answered Dec 6, 2018 at 2:10

ierdna

6,3639 gold badges55 silver badges91 bronze badges

Collectives™ on Stack Overflow

Vue/Typescript/Jest - Jest Unit Test SyntaxError: Unexpected token import

Versions and Environment

Previously worked in:

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

Versions and Environment

Previously worked in:

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related