TVke / react-native-tailwindcss

A react-native style system based on TailwindCSS
https://tvke.github.io/react-native-tailwindcss/
MIT License
565 stars 34 forks source link

Font Family not working #61

Open gcolotti opened 3 years ago

gcolotti commented 3 years ago

I tried with t.fontSans, t.fontSerif, t.fontMono, they show the same font. Also tried to add a custom font, as described here, but is not working.

Also, the fix used in #14 didn't work for me. The command npx RNtailwindcss is failing (cp: cannot stat '../react-native-tailwindcss/stubs/defaultConfig.stub.js': No such file or directory), so I created the config file with npx tailwind init --full .

I could configure custom a fontSize and colors, but fontFamily is not working at all.

This is how I have my fontFamily config:

 fontFamily: {
      sans: [
        '-apple-system',
        'BlinkMacSystemFont',
        '"Segoe UI"',
        'Roboto',
        '"Helvetica Neue"',
        'Arial',
        '"Noto Sans"',
        'sans-serif',
        '"Apple Color Emoji"',
        '"Segoe UI Emoji"',
        '"Segoe UI Symbol"',
        '"Noto Color Emoji"',
      ],
      serif: [
        'Georgia',
        'Cambria',
        '"Times New Roman"',
        'Times',
        'serif',
      ],
      mono: [
        'Menlo',
        'Monaco',
        'Consolas',
        '"Liberation Mono"',
        '"Courier New"',
        'monospace',
      ],
      metropolisLight: ['Metropolis-light'],
      metropolisSemibold: ['Metropolis-SemiBold'],
      metropolisMedium: ['Metropolis-Medium'],
      metropolisBold: ['Metropolis-Bold'],
    },

The custom fonts are working properly using react-native StyleSheet.

TVke commented 3 years ago

Hi @gcolotti

I have no idea what could cause this problem 🤔 Can you maybe send me an example repo to better test the problem?

greetings Thomas