Saturday, June 1, 2024
HomeiOS Developmentios - Sure customized fonts not showing with Tailwind CSS

ios – Sure customized fonts not showing with Tailwind CSS


I am attempting to make my first app utilizing React Native and Tailwind. I imported the Rajdhani font household to make use of on this app, however for some purpose solely Rajdhani Daring really exhibits up within the Expo preview on my IOS machine that I am testing on.

that is my index.js file:

import { StatusBar } from "expo-status-bar";
import { Textual content, View} from "react-native";
import { Hyperlink } from "expo-router";

export default operate App(){
    return(
        <View className="flex-1 items-center justify-center bg-white">
            <Textual content className="text-3xl font-rSemiBold">Check check</Textual content>
            <StatusBar model="auto" />
            <Hyperlink href="/sign-in" model={{colour: 'blue'}}>Proceed to Login</Hyperlink>
        </View>
    );
}

That is my tailwind.config.js:

/** @sort {import('tailwindcss').Config} */
module.exports = {
  content material: ["./app/**/*.{js,jsx,ts,tsx}", "./components/**/*.{js,jsx,ts,tsx}"],
  theme: {
    prolong: {
      colours: {
        main: '#D0E358'
      }
    },
    fontFamily: {
      rRegular: ["Rajdhani-Regular", "sans-serif"],
      rBold: ["Rajdhani-Bold", "sans-serif"],
      rSemiBold: ["Rajdhani-SemiBold", "sans-serif"],
      rLight: ["Rajdhani-Light", "sans-serif"],
      rMedium: ["Rajdhani-Medium", "sans-serif"]
    }
    
  },
  plugins: [],
}

and I’ve additionally connected a picture of my folder construction:screenshot

if I change rSemiBold with rBold, then it would work as meant, however any of the opposite members of the font household don’t. I’ve tried messing round with the config file by including single quotes round my customized font names or contained in the double quotes however nothing has labored. The file names are appropriate too and I checked the ttf information to ensure there was nothing improper with them



Supply hyperlink

RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

- Advertisment -
Google search engine

Most Popular

Recent Comments