Thiago Costa
Thiago Costa

Reputation: 21

React native components cannot be used as a JSX components after installing @types/styled-components-react-native

I'm trying to develop an application using react native expo bare worflow with typescript and styled components.

I was able to install styled components with yarn add styled-components and then yarn add @types/styled-components-react-native.

After this I was also able to create my styled components, but in the moment that I install @types/styled-components-react-native suddenly all my JSX components like View, Text, TouchableHighlight, etc, start giving me the message (ts2786):

View cannot be used as a JSX components

Text cannot be used as a JSX components

TouchableHighlight cannot be used as a JSX components ........

The application is running normally, but still this error is bothering me...

I tried not to install the styled components types, but the hot reload stops to work.

All my packages and react native is updated.

Thanks.

JSX error

Upvotes: 0

Views: 183

Answers (1)

Thiago Costa
Thiago Costa

Reputation: 21

After searching for a long day I discovered that when I was installing styled components types with @types/styled-components-react-native it was updating my react and react-dom to version 18 in package.json and this is what was giving me the error, since react-native in based in react version 17

To fix it just change versions to :

dependencies: "react": "17.0.2", "react-dom": "17.0.2"

devDependencies: "@types/react": "~17.0.21"

Upvotes: 2

Related Questions