webpack으로 모든 것을 묶지 않고 Jest로 테스트 할 때 "-! svg-reaction-loader!/path/to/my.svg"를 어떻게 무시할 수 있습니까?

Question

일부 SVG 파일에는 svg-react-loader가 사용됩니다 우리의 응용 프로그램. 우리는 바벨 - 농담으로 실행하기 위해 설치 농담하려고 다음과 같은 것 .babelrc :

이

{ 
    "presets": [ 
    "es2015", 
    "react" 
    ], 
    "plugins": [ 
    "transform-decorators-legacy", 
    "transform-class-properties", 
    "transform-object-rest-spread" 
    ] 
} 

다음 테스트가 실패 : Cannot find module '-!svg-react-loader!../../assets/grid.svg' from 'Icon.js'

: 오류

/* global it, document */ 
import React from 'react' 
import ReactDOM from 'react-dom' 
import Comp from './Icon' 

it('renders without crashing',() => { 
    const div = document.createElement('div') 
    ReactDOM.render(<Comp><div /></Comp>, div) 
}) 

'-! svg-reaction-loader! ../../ assets/grid.svg'에서 가져 오기 그리드와 같이 시작하는 수입을 무시할 수 있습니까? in jest?

Answer 1

내가이 문제를 해결 한 방법은 -! svg-react-loader가 포함 된 가져 오기에 대한 농담 모의를 추가하는 것입니다. 모듈 시작 부분에.

'use strict'; 
module.exports = 'div'; 

파일이 간단하지가 존재 할 수 있기 때문에 그것은 이상적인 건 아니지만, 가정이 웹팩와 함께 번들 때 우리가 누락 된 모듈을 볼 수 있다는 것입니다 : svgImportMock.js가

"moduleNameMapper": { 
    "^-!svg-react-loader.*$": "<rootDir>/config/jest/svgImportMock.js" 
} 

.