fgonzalez fgonzalez - 1 year ago 182
React JSX Question

export default not working webpack, reactjs

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);
<Provider store={store}>
<Router history={history}>
<Route path="/" component={App}>
<IndexRoute component={HomePage}/>




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

import React, { PropTypes } from 'react';

const App = (props) => {
return (

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!!

Answer Source

Omit the curly braces:

import App from './components/App';

That's the trick with default, see.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download