Vue wrapper custom font using url src not working

[mcelligottnick]

Following the example here, part of my component configuration looks like;

fonts: [
	{
		src: 'https://MYPUBLICURL/Poppins-Regular.woff',
		fontStyle: 'normal',
		fontFamily: 'Poppins',
		fontWeight: '400',
	},
	{
		src: 'https://MYPUBLICURL/Poppins-Bold.woff',
		fontStyle: 'normal',
		fontFamily: 'Poppins',
		fontWeight: '700',
	},
],

However when the component loads the font does not work. If I change the above to;

fonts: [
	{
		src: 'https://MYPUBLICURL/Poppins-Regular.woff',
		fontStyle: 'normal',
		fontFamily: 'Poppins',
		fontWeight: '400',
	},
	{
		src: 'https://MYPUBLICURL/Poppins-Bold.woff',
		fontStyle: 'normal',
		fontFamily: 'Poppins',
		fontWeight: '700',
	},
        'https://fonts.googleapis.com/css?family=Poppins',
],

I do see the Poppins font correctly.

If I visit https://MYPUBLICURL/Poppins-Regular.woff in an incognito browser it downloads the font as expected.