4

我正在使用 Mocha、Enzyme、Shallow 渲染并希望测试 ReactJS。我没有使用 babel 和 ES6。我在 Stack Overflow 上查看了其他问题，但没有人回答我的问题。

我正在使用带有 commonJS 和 Grunt 的 ES5 将 JSX 编译为 JS 并将 app.built.js 文件加载到 html 文件中，并且它都可以正常加载到页面上。

这是我的代码speedoApp.jsx

var React = require('react');
var ReactDOM = require('react-dom');

module.exports.default = React.createClass({
  render: function() {
    return(<p>Hello</p>);
  }
});

这是中的代码App.js

var React = require('react');
var ReactDOM = require('react-dom');
var SpeedoApp = require('./speedoApp.jsx').default;

ReactDOM.render(
  <SpeedoApp />,
  document.getElementById('container')
)

我的 HTML 文件：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Speedometer</title>
  </head>
  <body>
    <div id="container"></div>
    <script src="./scripts/app.built.js"></script>
  </body>
</html>

我的测试文件speedoSpec.js：

var React = require('react');
var expect = require('expect');
var enzyme = require('enzyme');
var shallow = enzyme.shallow;
var SpeedoApp = require('../../react_components/speedoApp.jsx');

describe('Component: speedoApp', function() {
  it('should display \'hello\' on the page', function() {
    var wrapper = shallow(<SpeedoApp />);
    expect(wrapper).to.have.length(1);
  });
});

我在运行 mocha 时收到错误消息：

var wrapper = shallow(<SpeedoApp />);
                      ^
SyntaxError: Unexpected token <

我也尝试过要求将文件app.built.js替换为.speedoApp.jsxspeedoSpec.js

有人知道我哪里出错了吗？

4

0 回答 0