Does Native wind support extending classes in the tailwind.config.js file?

29 Views Asked by At

So, my question is pretty straight forward. Can I add extended classes in my tailwind.config.js file when using NativeWind ? So here is my tailwind.config.js file :

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

  theme: {
    extend: {
      fontFamily: {
        display: "Oswald, ui-serif", // Adds a new `font-display` class
      },
    },
  },
};

as you can see I defined a new class named 'font-display' and to make sure I didn't make any mistake I copied this code from the offical documentation : https://tailwindcss.com/docs/theme#extending-the-default-theme .

and then In my index.tsx here is what I have :

function TestComponent() {
  return (
    <View style={style.container}>
      <TouchableOpacity style={style.contained} activeOpacity={0.7}>
        <Text className="font-display">Press me</Text>
      </TouchableOpacity>
    </View>
  );
}

export default TestComponent;

But the problem is That nothing happens. and when I was using Gihub copilot, it told me that native wind doesn't support extending classes and I didn't find anything about this on the internet like not even a single docs that mentions this.

0

There are 0 best solutions below