'Syntax: Unexpected identifier' 通过 react-scripts-ts 测试时出错

Question

使用 react-scripts-ts (2.17.0) 我正在尝试设置一个测试套件。但我收到 "SyntaxError: Unexpected identifier".

这是配置：

tsconfig.json (using the standard of JSX handbook)

{
  "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);

这就是测试设置：

./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 吗？

Answer 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';

而且有效。

'Syntax: Unexpected identifier' 通过 react-scripts-ts 测试时出错

'Syntax: Unexpected identifier' error when testing via react-scripts-ts

reactjs

jestjs

react-scripts