Vue unit test - SyntaxError: Cannot use import statement outside a module

Ionic Framework Ionic Vue
4

Ah I think we forgot to add a transformIgnorePatterns rule to jest.config.js. We need to transpile @ionic/vue since it uses ES6 import/export statements (See: https://cli.vuejs.org/core-plugins/unit-jest.html#transform-dependencies-from-node-modules)

In your jest.config.js file, add:

transformIgnorePatterns: ['/node_modules/(?!@ionic/vue|@ionic/vue-router)']

Also you will likely need to use mount instead of shallowMount otherwise the test utils will just stub components like ion-page. This is true of a Vue 3 application without Ionic Framework as well.

Does making these changes resolve the issue?

2 Likes