0
<View className="flex-1 items-center justify-center bg-white">
  <Text className="text-3xl">Hello World!</Text>
  

tailwind css isn't working in react native . It shows in topleft corner of the screen in mobile

i tried installing all the required components like

npm install nativewind npm install tailwindcss --save-dev npx tailwindcss init npm update tailwindcss nativewind added tailwindcss config

content: ["./app//*.{js,jsx,ts,tsx}", "./components//*.{js,jsx,ts,tsx}"],

added plugins: ["nativewind/babel"] in bable file

1 Answer 1

0

Adding the Babel preset module:metro-react-native-babel-preset is essential for your React Native project. It allows Babel to transform your code correctly for the React Native environment, enabling support for JSX and modern JavaScript features.

Here’s how your Babel configuration should look:

module.exports = {
    presets: ['module:metro-react-native-babel-preset'],
    plugins: ['nativewind/babel'],
};
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.