I have been following the Vue school guides on implementing Jest with Vue in order to start writing some unit tests.

So far I've installed jest, jest-serializer-vue, vue-template-compiler.

module.exports = {
    verbose: true,
    roots: [
        "<rootDir>/src/",
        "<rootDir>/src/specs/"
    ],
    moduleFileExtensions: ['js', 'vue'],
    moduleNameMapper: {
        '^@/(.*)$': '<rootDir>/src/$1',
    },
    transform: {
        "^.+\\.js$": "babel-jest",
        "^.+\\.vue$": "vue-jest",
    },
    snapshotSerializers: [
        "<rootDir>/node_modules/jest-serializer-vue"
    ]
}

When writing my first test it is building successfully.

import TestComponent from '../src/components/test';

test('mount a vue component', () => {
    console.log(TestComponent);
});

But when I try mounting Vue component it starts failing with the following error:

 FAIL  src/specs/test.spec.js
  ● Test suite failed to run

    TypeError: Cannot read property 'shallowMount' of undefined

The actual test file looks like this:

import TestComponent from '../src/components/test';

import { shallowMount } from '@vue/test-utils';

test('mount a vue component', () => {
    const wrapper = shallowMount(TestComponent);

    console.log(wrapper);
});

I don't understand why this is happening, and there is no info (at least I could not find some) as why this is failing. Can someone help me?

PS: My project is NOT using vue-cli.