未捕获错误:找不到模块“../../helpers/oidcHelpers.jsx”

时间:2016-06-22 12:02:58

标签: javascript reactjs ecmascript-6 webpack

我正在尝试导入模块,但它一直在浏览器(Chrome和Mozilla)控制台中抛出错误

Uncaught Error: Cannot find module "../../helpers/oidcHelpers.jsx" - LoginController.jsx?1471:6

这是我的LoginController.jsx文件

import React, {Component, PropTypes} from 'react';

import ActionAndroid from 'material-ui/svg-icons/action/android';
import RaisedButton from 'material-ui/RaisedButton';

import userManager from '../../helpers/oidcHelpers.jsx';

export default class LoginController extends Component {
  onFASLoginButtonClick = (event) => {
    event.preventDefault();
    console.log(userManager.signinRedirect);
    userManager.signinRedirect();
  };

  render() {
    return (
      <div>
        <RaisedButton
          label="Login with FAS"
          icon={<ActionAndroid/>}
          onMouseUp={this.onFASLoginButtonClick}
        />
      </div>
    );
  }
}

这是我的应用程序的目录结构。我已经剪断了不需要的文件

app
├── actions
│   └── actions.jsx
├── containers
│   ├── login
│   │   └── LoginController.jsx
├── helpers
│   ├── oidcHelpers.jsx
│   └── oidcHelpers.jsx.sample
├── index.jsx
├── reducers
│   ├── authentication.jsx
│   └── index.jsx
├── routes.jsx
└── stylesheets
    ├── base
    │   └── common.less
    ├── components
    └── drawer.less

尝试了很多,但无法弄清楚问题。我甚至尝试删除import语句并将导入更改为import userManager from '../../helpers/oidcHelpers'但我仍然遇到同样的错误。进行更改不会更新浏览器中的代码。

代码托管在Github上:https://github.com/waartaa/waartaa/tree/develop/waartaa/client

1 个答案:

答案 0 :(得分:1)

您在helpers/oidcHelpers.jsx中没有默认导出

LoginController.jsx中的导入从import userManager更改为import { signinRedirect }并通过调用signinRedirect而非userManager.signinRedirect正确使用

import React, {Component, PropTypes} from 'react';

import ActionAndroid from 'material-ui/svg-icons/action/android';
import RaisedButton from 'material-ui/RaisedButton';

import { signinRedirect } from '../../helpers/oidcHelpers.jsx';

export default class LoginController extends Component {
  onFASLoginButtonClick = (event) => {
    event.preventDefault();
    console.log(signinRedirect);
    signinRedirect();
  };

  render() {
    return (
      <div>
        <RaisedButton
          label="Login with FAS"
          icon={<ActionAndroid/>}
          onMouseUp={this.onFASLoginButtonClick}
        />
      </div>
    );
  }
}