javascript - 针对 JSX 语法运行 mocha 时出现错误 "Unexpected token"

Question

我是 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 )，所以你可以看到安装的依赖项。

我应该如何解决这个问题？有没有我错过的步骤？

Answer 1

你需要在 package.json 中添加 react preset 到你的 babel 配置

"babel": {
  "presets": ["es2015", "react"]
}