16

I'm new to webpack, I'm starting to build an app using webpack and react 15, however it's like the export default is not working properly because I got an error as the App component is not found:

 5:9  App not found in './components/App'  import/named

Below the code of my index.js:

import React from 'react';
import ReactDOM from 'react-dom';
import {Router,Route,IndexRoute,browserHistory} from 'react-router';
import { Provider } from 'react-redux';
import {App} from './components/App';
import {HomePage} from './components/HomePage';

import configureStore from './store/configureStore.js';
import { syncHistoryWithStore } from 'react-router-redux';



const store = configureStore();

const history = syncHistoryWithStore(browserHistory, store);
ReactDOM.render(
    <Provider store={store}>
        <Router history={history}>
            <Route path="/" component={App}>
                <IndexRoute component={HomePage}/>



            </Route>


        </Router>

    </Provider>,
    document.getElementById('app')
);

and the code of my App.js placed under components folder:

import React, { PropTypes } from 'react';


const App = (props) => {
  return (
    <div>
      {props.children}
    </div>
  );
};

App.propTypes = {
  children: PropTypes.element
};

export default App;

Can anyone see the problem? Looks like this type of export is not supported and I have to enable something? Any help is appreciatted!!

1 Answer 1

60

Omit the curly braces:

import App from './components/App';

That's the trick with default, see.

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.