I am building a React Vite Application and using @react-pdf/pdf.
I want to add custom font files which are .ttf

I import my font files from where they are. The path is correct:

import PrometoBold from '../../../../assets/fonts/Prometo-Bold.ttf';
import PrometoMedium from '../../../../assets/fonts/Prometo-Medium.ttf';
import PrometoRegular from '../../../../assets/fonts/Prometo-Regular.ttf';
import PrometoLightItalic from '../../../../assets/fonts/Prometo-LightItalic.ttf';

//Register 
Font.register({family: 'PrometoRegular', src: PrometoRegular });
Font.register({family: 'PrometoLightItalic', src: PrometoLightItalic });  
Font.register({family: 'PrometoMedium', src: PrometoMedium }); 
Font.register({family: 'PrometoBold', format: 'truetype', src: PrometoBold }); 

Then I use them in my:

const styles = StyleSheet.create({
    title: {
        fontFamily: 'PrometoBold',
        textAlign: 'center',
        color: '#001C43',
        fontSize: 24,
        marginBottom: 10
    }
});

Then doing this:

const PdfDocument = () => {
    return(
        <Document>
            <Page key={index} size="A4" style={styles.page} wrap={true}>
              <Text style={styles.title}>This my title</Text>
            </Page>
        </Document>
    );
};
export default PdfDocument;

But for a strange reason now the PDF isn’t being generated anymore.
When removing the line fontFamily: 'PrometoBold', it is generated again but without the font.