CODEWITHSUNDEEP
javascriptreactjstypescript
Leon Gaban
Leon Gaban

Reputation: 39018

Why am I getting the no exported member error in this React/Typescript app?

enter image description here

The router.tsx

import * as React from 'react';
import { Route, HashRouter, Switch } from 'react-router-dom';
import App from './App';
import { LoginContainer } from './containers';

export const AppRouter: React.StatelessComponent<{}> = () => {
  return (
    <HashRouter>
      <div className="container-fluid">
        <Route component={App} />
        <Switch>
          <Route exact path="/" component={LoginContainer} />
          <Route path="/login" component={LoginContainer} />
        </Switch>
      </div>
    </HashRouter>
  );
}

The Folder structure:

enter image description here

The src/containers/index.ts 

export * from './auth/LoginContainer';

Finally the LoginContainer

import * as React from 'react';

class LoginContainer extends React.Component {
  public render() {
    return (
      <div>
        <header>
          <h1>This is the Login Container</h1>
        </header>
      </div>
    );
  }
}

export default LoginContainer;

Upvotes: 1

Views: 165

Answers (1)

Andy Ray
Andy Ray

Reputation: 32066

You need to export the default as named.

export { default as LoginContainer } from './auth/LoginContainer';

More: http://jamesknelson.com/re-exporting-es6-modules/

Upvotes: 3

Related Questions