这是一个伟大的 .
出于某种原因，开玩笑和babel不会导入和转换反应路由器4与路由器 .
我最近从react-router 3更新到react-router 4.我的单页应用程序通过webpack编译就好了，我可以在浏览器中导航我的本地开发版本 .
但是，涉及使用withRouter HOC包装的组件的测试会失败 .
具体来说，如果被测试的组件具有使用withRouter HOC的后代组件，则甚至无法导入withRouter . 控制台日志显示withRouter导入为“undefined”
该文件夹包含以下文件 .
app/
├── src/
├── LoginContainer.jsx
├── LoginForm/
├── index.js
└── LoginForm.jsx
LoginContainer（反应容器组件）
import React from 'react';
import PropTypes from 'prop-types';
import LoginForm from './LoginForm';
export default class LoginContainer extends React.Component {
constructor(props) {
super(props);
this.state = { currentForm: props.form };
this.changeForm = this.changeForm.bind(this);
}
changeForm(form) {
// handle when someone changes something.
}
render() {
return (
<section>
<LoginForm {...this.props} changeForm={this.changeForm} data-form={this.state.currentForm} />
</section>
);
}
}
LoginForm / index.js（基本上是一个包装LoginForm.jsx的HOC）
import LoginForm from './LoginForm';
import { withRouter } from 'react-router';
// NO MATTER WHAT I DO...
// withRouter is undefined.
// If I do import * as bob from 'react-router'
// bob then equals { default: {} }
// bob is blank!
export default withRouter(LoginForm);
出于某种原因，我无法在测试时导入withRouter . 所有其他模块导入都很好，只有withRouter导致问题 .
-
react-router 4.2.0和react-router-dom 4.2.2都作为依赖项安装
-
使用Link或Route之类的其他组件通过测试就好了
UPDATE
我认为这与开玩笑的巴贝尔有关 . 如果我将import语句切换到require语句，它就可以了！
import LoginForm from './LoginForm';
// THIS WORKS! But I don't want to deviate from ES6 just for a test.
const withRouter = require('react-router/index.js').withRouter;
export default withRouter(LoginForm);