title: Why am I unable to import SVG in Jest?
body: <p>This is the component I want to test</p>
  <p>footer/index.jsx</p>
  <pre><code>import React from &quot;react&quot;;
  
  import logoImg from &quot;@/assets/images/components/header/logo-header.svg&quot;;
  import HeaderTextImg from &quot;@/assets/images/components/header/header-text.svg&quot;;
  
  function Footer() {
    return (
      &lt;div&gt;Footer&lt;/div&gt;
    );
  }
  
  export default Footer;
  </code></pre>
  <p>When I run the test by <code>npm run test</code>, it shows error<br/>
  <a href="https://i.stack.imgur.com/D8acb.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/D8acb.png" alt="enter image description here" /></a>
  <a href="https://i.stack.imgur.com/vZYtD.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/vZYtD.png" alt="enter image description here" /></a></p>
  <p>package.json</p>
  <pre><code> &quot;scripts&quot;: {
      &quot;test&quot;: &quot;jest --watchAll&quot;,
      &quot;test-coverage&quot;: &quot;jest --coverage&quot;, 
    },
    &quot;jest&quot;: {
      &quot;moduleDirectories&quot;: [
        &quot;node_modules&quot;,
        &quot;src&quot;
      ],
      &quot;moduleNameMapper&quot;: {
        &quot;\\.(css|scss)$&quot;: &quot;identity-obj-proxy&quot;
      },
      &quot;setupFilesAfterEnv&quot;: [
        &quot;&lt;rootDir&gt;/src/setupTests.js&quot;
      ],
      &quot;snapshotSerializers&quot;: [
        &quot;enzyme-to-json/serializer&quot;
      ]
    }
  </code></pre>
  <p><strong>What I tried<br/></strong>
  I tried to use <code>jest-svg-transformer</code> in <code>package.json</code> like below:</p>
  <pre><code>        &quot;transform&quot;: {
              &quot;^.+\\.jsx?$&quot;: &quot;babel-jest&quot;,
              &quot;^.+\\.svg$&quot;: &quot;jest-svg-transformer&quot;
          }
  </code></pre>
  <p>it shows error too:<br/></p>
  <pre><code>    ● Invalid transformer module:
        &quot;/Users/CCCC/Desktop/SourceTree/my-proj/node_modules/jest-svg-transformer/lib/index.js&quot; specified in the &quot;transform&quot; object of Jest configuration
        must export a `process` or `processAsync` or `createTransformer` function.
        Code Transformation Documentation:
        https://jestjs.io/docs/code-transformation
  </code></pre>
  <p><strong>Update 1<br/></strong>
  I also tried<br/></p>
  <pre><code>moduleNameMapper: {
      &quot;^.+\\.svg$&quot;: &quot;jest-svg-transformer&quot;,
  }
  </code></pre>
  <p>but not working too</p>
  <p><strong>Update 2<br/></strong>
  Tried <a href="https://www.npmjs.com/package/svg-jest" rel="nofollow noreferrer">svg-jest</a> too but still not working</p>