Can not use Google Fonts as custom font

[arjendevos]

This is my app.tsx:

import {
  useFonts,
  Nunito_200ExtraLight,
  Nunito_300Light,
  Nunito_400Regular,
  Nunito_500Medium,
  Nunito_600SemiBold,
  Nunito_700Bold,
  Nunito_800ExtraBold,
  Nunito_900Black,
} from "@expo-google-fonts/nunito";

export default function App() {
  useFonts({
    nunito_extralight: Nunito_200ExtraLight,
    nunito_light: Nunito_300Light,
    nunito_regular: Nunito_400Regular,
    nunito: Nunito_500Medium,
    nunito_semibold: Nunito_600SemiBold,
    nunito_bold: Nunito_700Bold,
    nunito_extrabold: Nunito_800ExtraBold,
    nunito_black: Nunito_900Black,
  });
  return (
    <GestureHandlerRootView style={{ flex: 1 }}>
      <Provider>
        <BottomSheetModalProvider>
          <StatusBar barStyle="dark-content" backgroundColor="#fdf7f2" translucent={true} />
          <NativeNavigation />
        </BottomSheetModalProvider>
      </Provider>
    </GestureHandlerRootView>
  );
}

And this is my dripsy.tsx (how i create my theme):

const theme = makeTheme({
  // https://www.dripsy.xyz/usage/theming/create
  customFonts: {
    ["nunito"]: {
      "200": `nunito_extralight`,
      "300": `nunito_light`,
      "400": `nunito_regular`,
      "500": `nunito`,
      "600": `nunito_semibold`,
      "700": `nunito_bold`,
      "800": `nunito_extrabold`,
      "900": `nunito_black`,
    },
  },
  fonts: { root: "nunito" },
})

But i get this error:

Unrecognized font family 'nunito_semibold'

So i removed the semi bold, but that gives me this error:

Unrecognized font family 'nunito'

I can't find any documentation on how to use Dripsy with Google Fonts. Is this even possible?

[nandorojo]

could you make an expo snack?

[arjendevos]

I tried something fast but i can't get the google fonts import to work. https://snack.expo.dev/@richardlindhout/smart-truffle

[nandorojo]

Many things were wrong with your snack.

• Your dripsy file had a named export but was imported via default import.
• useFonts should be imported from expo-font.
• You need to return null (or something else) before useFont is ready.

It works fine once I fixed it:

Snack: https://snack.expo.dev/@beatgig/dripsy-google-fonts