title: Jest Error Unexpected token on react component
body: <p><a href="https://i.stack.imgur.com/TYhC5.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/TYhC5.png" alt="enter image description here"></a></p>
  
  <p>I am getting Unexpected token on the <code>React Component Name</code> while running <code>npm test</code>. Tried reading several other similar questions but none seems to be working for me. I have added content of babelrc , package.json and my test file content below</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!-- content of .babelrc file --&gt;
  { "presets": ["env"] }
  
  &lt;!-- content of package.son file --&gt;
    "dependencies": {
      "react": "^16.2.0",
      "react-bootstrap": "^0.32.1",
      "react-dom": "^16.2.0",
      "react-redux": "^5.0.7",
      "react-router-dom": "^4.2.2",
      "react-scripts": "1.1.1",
      "redux": "^3.7.2"
    },
    "scripts": {
      "start": "react-scripts start",
      "build": "react-scripts build",
      "test": "jest",
      "eject": "react-scripts eject"
    },
    "devDependencies": {
      "babel-cli": "^6.26.0",
      "babel-jest": "^23.0.0-alpha.0",
      "babel-preset-env": "^1.6.1",
      "babel-preset-react": "^6.24.1",
      "enzyme": "^3.3.0",
      "enzyme-adapter-react-16": "^1.1.1",
      "enzyme-to-json": "^3.3.3",
      "jest": "^22.4.2",
      "react-test-renderer": "^16.2.0"
    },
    "jest": {
      "notify": true,
      "snapshotSerializers": [
        "enzyme-to-json/serializer"
      ],
      "setupTestFrameworkScriptFile": "./src/setupTests.js",
      "transform": {
        "^.+\\.jsx?$": "babel-jest"
      }
    }
  
  &lt;!-- Content of Test file App.test.js --&gt;
  import React from 'react';
  import { shallow, mount } from 'enzyme';
  import App from '../../src/components/App';
  
  // describe what we are testing
  describe('Render App Component', () =&gt; {
   
   // make our assertion and what we expect to happen 
   it('should render without throwing an error', () =&gt; {
      wrapper = shallow(&lt;App /&gt;);
      expect(wrapper.find('.app__wrapper').length).toEqual(1);
   })
  })</code></pre>
  </div>
  </div>
  </p>