Create Containers


#1

From @jayair on Mon Apr 10 2017 01:02:28 GMT+0000 (UTC)

Link to chapter - http://serverless-stack.com/chapters/create-containers.html

Copied from original issue: https://github.com/AnomalyInnovations/serverless-stack-com/issues/34


#2
Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check the render method of `Route`.

I am facing this issue when i added in App.js. I am sure i am doing something silly. Anyone else faced this issue ?


#3

Can you tell me after which step you are seeing this?


#4

I’m seeing this too, after pasting in the code for App.js.

When I delete the <Navbar.Header> and </Navbar.Header> tags, the error goes away, but the display doesn’t look right. it’s complaining about the fluid attribute of Navbar being a Boolean.

Here’s my code:

import React, { Component } from 'react';
import Routes from './Routes';
import { Link } from 'react-router-dom';
import { Navbar } from 'react-bootstrap';
import './App.css';

class App extends Component {
    render() {
        return (
            <div className="App container">
                <Navbar fluid collapseOnSelect>
                    <Navbar.Brand>
                        <Link to="/">Scratch</Link>
                    </Navbar.Brand>
                    <Navbar.Toggle />
                </Navbar>
                <Routes />
            </div>
        );
    }
}

export default App;And here’s the error on the page:


#5

This is a problem with the version of react-bootstrap.

If you install this version of the package, you will not see these errors:

"react-bootstrap": "^0.32.4"

I was having a problem with the latest version, which is currently:

"react-bootstrap": "^1.0.0-beta.5"

#6

Thanks for letting me know. I’ll update the tutorial to pin the version for now.