0

I've followed the documentation on the NativeWind site to setup NativeWind with me React native application, but it doesn't seem to be working.

I have several other react projects running with Tailwind (CRA and NextJS), but can't get this to work.

I've tried

  • to clear the cache
  • adding NativeWindStyleSheet to my App.tsx file.

My tailwind.config.js file.

const { createGlobPatternsForDependencies } = require('@nx/react/tailwind');
const { join } = require('path');

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    join(__dirname, [
      './index.{js,jsx,ts,tsx}',
      './src/App.{js,jsx,ts,tsx}',
      './src/components/*.{js,jsx,ts,tsx}',
      './src/modules/*.{js,jsx,ts,tsx}',
      './src/**/*.{js,jsx,ts,tsx}',
    ]),
    ...createGlobPatternsForDependencies(__dirname),
  ],
  theme: {
    extend: {
      colors: {
        inactive: '#C4C4C4',
        tint: 'rgb(216, 216, 216)',
        'rapio-green': '#00C17C',
        'rapio-pink': '#dd016b',
        warning: '#FFC046',
        alert: '#FF7575',
        success: '#06D98D',
        info: '#2196f3',
        space: '#F9F9F9',
      },
    },
  },
  plugins: [],
};

Text component.

 <View className="bg-black h-screen p-y-4">
   <ActivityIndicator size="large" />
 </View>

What am I doing wrong? How can I get this to work?

Salman
  • 1,109
  • 3
  • 25
  • 55

1 Answers1

0

It's a little bit late, but may be help anyone You have to add to babel.config.json

{
  "plugins": ["nativewind/babel"]
}
Sharqi
  • 86
  • 1
  • 3