Can’t find variable: Styled Styledcomponents React Native

Question

Following this tutorial

Was installed through Yarn the Styled-Components:

yarn add axios prop-types react-navigation styled-components

So in my Styles.js file I defined a class:

const Container = styled.View`
    flex: 1;
    alignItems: center;
    justifyContent: center;
    backgroundColor: #00a999;
`;

And in the end export:

export { Container, Logo, Input, ErrorMessage, Button, ButtonText, SignUpLink, SignUpLinkText };

But I get:

Can’t find variable: Styled

In the tutorial cites something about this:

As you may have noticed, we no longer use the Stylesheet.create()passing an object as parameter, with Styled Components create a constant for each component with the prefix Styled. then inside a block of crases (`) we pass the same CSS styles, without using apostrophe (>) nor comma(,) at the end of the lines, therefore following this pattern of appointment you can create any component as if using the Stylesheet.

Answer 1

By error message, it seems that failed to import Styled Components into your style file. Here is an example of:

import styled from "styled-components/native";

export const Container = styled.View`
    flex: 1;
    alignItems: center;
    justifyContent: center;
    backgroundColor: #00a999;
`;

export const ImageBackground = styled.ImageBackground`
  width: 100%;
  height: 100%;
`;

export const Logo = styled.Image`
  width: 72px;
  height: 72px;
`;

In the file where I will use these styles,:

import {ImageBackground,Container,Logo} from "./styles";