https://www.nativewind.dev/quick-starts/expo
npm install nativewind
npm install --save-dev [email protected]
tailwind.config.js
filenpx tailwindcss init
tailwind.config.js
Change if there is Custom Directory or remove it in the array
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ["./App.{js,jsx,ts,tsx}","./<custom directory>/**/*.{js,jsx,ts,tsx}"],
theme: {
extend: {},
},
plugins: [],
}
babel.config.js
module.exports = function(api) {
api.cache(true);
return {
presets: ['babel-preset-expo'],
plugins: ["nativewind/babel"],
};
};
import { Text, View } from 'react-native';
export default function App() {
return (
<View className="flex-1 items-center justify-center bg-white">
<Text>Open up App.js to start working on your app!</Text>
<StatusBar style="auto" />
</View>
);
}