Fab icon not working on web

Current behaviour

The fab icon is not properly loading the font. As seen in the official demo here

Expected behaviour

Font icon loads as seen on android and ios

Code sample

import * as React from 'react';
import { StyleSheet } from 'react-native';
import { FAB } from 'react-native-paper';

const MyComponent = () => (
  <FAB
    style={styles.fab}
    small
    icon="plus"
    onPress={() => console.log('Pressed')}
  />
);

Your Environment

See expo snack listed above and locally I am using

software	version
react-native	0.63
react-native-paper	^4.3.1
react-native-vector-icons	^7.1.0
expo	39.0.0

[RichardLindhout]

I don’t use expo but with create-react-app 4 i had problems with react-native-vector-items

     {Platform.OS === 'web' ? (
              <style type="text/css">
                {`@font-face {
                font-family: 'MaterialCommunityIcons';
                src: url(${
                  require('react-native-vector-icons/Fonts/MaterialCommunityIcons.ttf')}) format('truetype');
              }`}
              </style>
            ) : null}

Adding .default fixed it for me

     {Platform.OS === 'web' ? (
              <style type="text/css">
                {`@font-face {
                font-family: 'MaterialCommunityIcons';
                src: url(${
                  require('react-native-vector-icons/Fonts/MaterialCommunityIcons.ttf')
                    .default
                }) format('truetype');
              }`}
              </style>
            ) : null}

[github-actions[bot]]

Hello 👋, this issue has been open for more than 2 months with no activity on it. If the issue is still present in the latest version, please leave a comment within 7 days to keep it open, otherwise it will be closed automatically. If you found a solution on workaround for the issue, please comment here for others to find. If this issue is critical for you, please consider sending a pull request to fix the issue.