Cannot find module 'components/layouts/default/Banner' from 'test/banner.test.js&#039-CodePudding

I am trying to get Jest working with my Nuxt project and I have it set up so that it runs tests fine however when my components are in a subfolder (or deeper) I am getting the following error.

Cannot find module 'components/layouts/default/Banner' from 'test/banner.test.js'

I suspect it has something to do with how I have configured Jest, but because I am fairly new to Jets I am not aware of what that is. Here is my jest.config file

module.exports = {
  setupFiles: ['<rootDir'>/jest.setup.js'], 
  moduleNameMapper: {
    '^@/(.*)$': '<rootDir>/$1',
    '^~/(.*)$': '<rootDir>/$1',
    '^vue$': 'vue/dist/vue.common.js'
  }, 
  moduleFileExtensions: ['js', 'vue', 'json'], 
  testPathIgnorePatterns: ['/dist/', '/node_modules/'], 
  transform: {
    '^. \\.js$': '<rootDir>/node_modules/babel-jest',
    '^. \\.(vue)$': '<rootDir>/node_modules/vue-jest'
  }
  transformIgnorePatterns: ['<rootDir>/node_modules/(?!vuetify)'], 
  collectCoverage: true, 
  collectCoverageFrom: [
    '<rootDir>/api/**/*.js',
    '<rootDir>/components/**/*.vue',
    '<rootDir>/pages/**/*.vue',
    '<rootDir>/store/**/*.js'
  ], 
  verbose:true
}

Here is my jest test inside my test folder called banner.test.js

import {shallowMount} from '@vue/test-utils';
import Banner from 'components/layouts/default/Banner';

let wrapper = null;

beforeEach(()=>{
  wrapper = shallowMount(Banner, {
   propsData:{
     text: 'test text'
    }
  })
})

it('test text', ()=> {
   expect(wrapper.find('.bannerText').toBe('test text')
})

CodePudding user response：

Try this

import Banner from '@/components/layouts/default/Banner';