src\components\Home.js Line 6:10: 'Container' is not defined react/jsx-no-undef

Question

import React from 'react'
import styled from "styled-components";

function Home() {
    return (
        <Container>
            home
        </Container>
    )
}

export default Home

the error comes

src\components\Home.js Line 6:10: 'Container' is not defined react/jsx-no-undef

Answer 1

You need to define Container first for example:

import React from 'react'
import styled from "styled-components";

const Container = styled.Text`
 font-size: 42;
`;

function Home() {
    return (
        <Container>
            home
        </Container>
    )
}

export default Home

If you have a Container that you are already created and exported defaultl then import it as follows

import React from 'react'
import styled from "styled-components";
import Container from "file-path";

function Home() {
    return (
        <Container>
            home
        </Container>
    )
}

export default Home

If you export Container as constant then you need to import as

import React from 'react'
import styled from "styled-components";
import { Container } from "file-path";

function Home() {
    return (
        <Container>
            home
        </Container>
    )
}

export default Home

For more please refer this