Шут встретил неожиданный токен Реакт

Question

Это скриншот ошибки:

У меня есть 2 теста, первый работает нормально: sum.js:

function sum(a, b) {
    return a + b;
  }
  module.exports = sum;

sum.test.js

const sum = require('./sum');

test('adds 2 + 5 to equal 7', () => {
  expect(sum(2, 5)).toBe(7);
});

все работает нормально, печатает сообщение в консоли.

второй (я не уверен) установлен по умолчанию create-реагировать-приложение

App.test.js:

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';

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

App.js:

import React, { Component } from 'react';
import {HashRouter} from "react-router-dom";
import Routes from './routes';
import Alerts from './app/components/alerts';
import Navbar from '../src/app/navbar/navbar'
import Auth from './app/settings/auth';
import Register from './app/entities/user/modify-modal';
import './index.scss';

class App extends Component {

    componentWillMount(){
    }

  render() {
    return (
      <HashRouter>
                <>
                    <Auth></Auth>
                    <Navbar></Navbar>
                    <Alerts></Alerts>
                    <Register/>
                    <div className={"content-root"}>
                        <Routes/>
                    </div>
                </>
            </HashRouter>
    );
  }
}

export default App;

package.json

{
  "name": "x5_r_app",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@babel/cli": "^7.2.3",
    "@babel/plugin-proposal-class-properties": "^7.4.0",
    "@babel/plugin-syntax-dynamic-import": "^7.2.0",
    "@babel/preset-env": "^7.4.1",
    "@babel/preset-flow": "^7.0.0",
    "@babel/preset-react": "^7.0.0",
    "@fortawesome/fontawesome-free": "^5.7.1",
    "@fortawesome/fontawesome-svg-core": "^1.2.12",
    "@fortawesome/free-solid-svg-icons": "^5.6.3",
    "@fortawesome/react-fontawesome": "^0.1.3",
    "axios": "^0.18.0",
    "babel-eslint": "^10.0.1",
    "babel-loader": "^8.0.5",
    "bootstrap": "^4.2.1",
    "jest": "^24.5.0",
    "jest-cli": "^24.5.0",
    "jsdom": "^14.0.0",
    "moment": "^2.23.0",
    "node-sass": "^4.11.0",
    "react": "^16.7.0",
    "react-addons-test-utils": "^15.6.2",
    "react-bootstrap": "^1.0.0-beta.5",
    "react-bootstrap-typeahead": "^3.2.4",
    "react-datetime": "^2.16.3",
    "react-debounce-input": "^3.2.0",
    "react-dom": "^16.7.0",
    "react-router-dom": "^4.3.1",
    "react-scripts": "2.1.2",
    "react-select": "^2.3.0",
    "reactstrap": "^7.0.2",
    "rxjs": "^6.3.3",
    "scss": "^0.2.4",
    "test": "^0.6.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "jest",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ],
  "devDependencies": {
    "@babel/core": "^7.4.0",
    "babel-core": "^6.26.3",
    "babel-jest": "^24.5.0"
  }
}

package-lock.json - 20000 строккода, поэтому я не знаю, какая его часть нужна для объяснения моей проблемы, все руководства, которые я читал об этой проблеме, были для меня бесполезны, поэтому я спрашиваю здесь.

Answer 1

Проблема в том, что приложение было загружено с create-react-app, но затем также была установлена ​​последняя версия Jest, и сценарий npm test в package.json был изменен для непосредственного запуска jest.

Тест не пройден, поскольку Jest не настроен для передачи синтаксиса JSX.

---

Тесты, использующие синтаксис, такие как JSX, должны быть переданы перед тем, как они могут быть запущены Jest.

create-react-app включает react-scripts, который обрабатывает всю эту конфигурацию автоматически.

---

Если приложение загружается с create-react-app, тогда Jest не нужно устанавливать и настраивать вручную.

---

Если приложение не загружено с create-react-app или если приложение извлечено из create-react-app, тогда необходимо установить и настроить Jest для переноса тестового кода.