错误 "Unexpected token" 当 运行 mocha 反对 JSX 语法

Error "Unexpected token" when run mocha against JSX syntax

我是 Javascript 编程的新手。我尝试为具有 JSX 格式的脚本编写测试,但有些失败 Unexpected token.

这是测试代码,我还没有写任何测试。

//Rectangle.js
let assert = require('chai').assert,
    path = require('path');

import Rectangle from './Rectangle';

这是需要测试的代码

//Rectangle.jsx
import React from 'react';

class Rectangle extends React.Component {
    render() {
       return <h1>Hello, {this.props.name}</h1>;
    }
}

这是错误

SyntaxError: Rectangle.jsx: Unexpected token (5:11)
  3 | class Rectangle extends React.Component {
  4 |   render() {
> 5 |     return <h1>Hello, {this.props.name}</h1>;
    |            ^
  6 |   }
  7 | }

这是我从一些文章 nyc mocha --compilers js:babel-core/register Rectangle.js 中得到的 mocha 命令。

我也在 github (link) 上上传了代码,所以你可以看到安装的依赖项。

我应该如何解决这个问题?有没有我漏掉的步骤?

您需要在 package.json

中添加 react preset 到您的 babel 配置
"babel": {
  "presets": ["es2015", "react"]
}

我认为您可能需要自定义编译器来帮助您编译 jsx 代码。

您可以在此处查看示例:Mocha-react repo