Ошибка «Синтаксис: неожиданный идентификатор» при тестировании через react-scripts-ts

Используя react-scripts-ts (2.17.0), я пытаюсь настроить набор тестов. Но я получаю «SyntaxError: Неожиданный идентификатор».

Ошибка «Синтаксис: неожиданный идентификатор» при тестировании через react-scripts-ts

Это конфигурация:

tsconfig.json (используя стандарт справочника JSX)

{
  "compilerOptions": {
    "jsx": "react"
  }
}

Это макет компонента:

./App.tsx

interface IAppProps extends WithStyles<typeof styles> {
  // ...
}

export interface IAppState {
  // ...
}

class App extends React.Component<IAppProps, IAppState> {
  // ...
}

export default withStyles(styles)(App);

И это будет тестовая установка:

./приложение.test.ts

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

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

Должен ли я каким-то образом управлять Babel?

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
0
0
110
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Оказывается, стили были загружены как es, а не определены по типу файла. Ответ найден здесь: https://github.com/mui-org/material-ui/issues/14349

Обновлено с "react-scripts-ts": "2.17.0" на "react-scripts-ts": "^3.1.0"

Затем изменил:

import withStyles from '@material-ui/core/es/styles/withStyles';
import { WithStyles } from '@material-ui/core/styles/withStyles';

К:

import { withStyles, WithStyles } from '@material-ui/core';

И это работает.

Другие вопросы по теме