Failed to load resource: roboto-regular.woff2


#1

I am experiencing a problem with several of my ionic apps loading fonts on Android. Running command ionic serve correctly copies all fonts from node_modules/ionic-angular to the www/assets/fonts folder, but when I run ionic cordova run android only two ionicons files remain in the www/assets/fonts folder - causing the android app to render with default fonts.

Failed to load resource: net::ERR_FILE_NOT_FOUND roboto-regular.woff2

cli packages:
@ionic/cli-utils : 1.9.2
ionic (Ionic CLI) : 3.9.2
global packages:
Cordova CLI : 7.0.1
local packages:
@ionic/app-scripts : 2.1.3
Cordova Platforms : android 6.2.3
Ionic Framework : ionic-angular 3.6.0
System:
Android SDK Tools : 26.0.2
Node : v6.11.2
npm : 3.9.3
OS : Windows 10


#2

+1
Just the same here.


#3

I have temporarily solved the problem by adding a hook to cordova build process:
in config.xml add:
<hook src="hooks/copy-fonts.js" type="after_prepare" />
then create a copy-fonts.js file in hooks folder with content

var copyfiles = require('copyfiles');
module.exports = function (context) {
    copyfiles([
        'node_modules/ionic-angular/fonts/**/*',
        'www/assets/fonts'
    ],
        true,
        () => { });
}

you must also install copyfiles package with npm
npm install --save-dev copyfiles


Long white screen on Android
#4

That did it for me too. Thanks !


#5

This works for loading roboto fonts but to load custom fonts I solved by moving them from assets/fonts to assets and update index.html from <link rel="stylesheet" href="assets/fonts/fonts.css"> to <link rel="stylesheet" href="assets/fonts.css">