Ionic-app-scripts: ionic run andriod not copying ionic angular fonts to www directory @app-scripts .46

Created on 22 Nov 2016  路  49Comments  路  Source: ionic-team/ionic-app-scripts

Note: for support questions, please use one of these channels:

https://forum.ionicframework.com/
http://ionicworldwide.herokuapp.com/

Short description of the problem:

upon ionic run android -l -c -s fonts are not getting copied. run works on the device though

What behavior are you expecting?

should copy fonts to the www directory

Steps to reproduce:

  1. ionic run android -l -c -s
    2.
    3.
insert any relevant code between the above and below backticks

copy: Error copying "/home/dhruv/solve-buyer/node_modules/ionic-angular/fonts" to
"/home/dhruv/solve-buyer/www/assets/fonts"

Which @ionic/app-scripts version are you using?
.46

Other information: (e.g. stacktraces, related issues, suggestions how to fix, stackoverflow links, forum links, etc)

Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.12
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.46
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Linux 4.4
Node Version: v6.9.1
Xcode version: Not installed

Most helpful comment

This is a known issue. I am reworking the copy task now as it's insufficient in it's present state. This will be resolved in the coming days. I'll keep you posted.

Thanks,
Dan

All 49 comments

I get exactly the same issue - (Using CLI 2.1.8 as 2.1.12 has other issues I can't work without)

Same issue here with 0.0.46: [15:52:26] copy: Error copying "/Users/federicomaceachen/mobile-apps/rutinas-app/node_modules/ionicons/dist/fonts" to
"/Users/federicomaceachen/mobile-apps/rutinas-app/www/assets/fonts"

Ionic Info:
Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.12
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.46
ios-deploy version: 1.8.7
ios-sim version: 5.0.8
OS: macOS Sierra
Node Version: v6.0.0
Xcode version: Xcode 8.1 Build version 8B62

Same issue here:

Cordova CLI: 6.3.1
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.12
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.46
ios-deploy version: 1.9.0
ios-sim version: 5.0.8
OS: OS X El Capitan
Node Version: v6.9.1
Xcode version: Xcode 8.1 Build version 8B62

Similar error here:
copy: Error copying "xxxxx/node_modules/ionic-angular/fonts" to "xxxxx/www/assets/fonts"

Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.12
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.46
ios-deploy version: 1.9.0
ios-sim version: 5.0.8
OS: macOS Sierra
Node Version: v7.1.0
Xcode version: Xcode 8.1 Build version 8B62

I just delete the folder "www/assets" and then compile/serve again, and everything work fine again

I have deleted all /www directory and then all works fine again.

I deleted all and it didn't make any difference, same error message appears.

This error seems to appear intermittently, which would indicate that there's some sort of race condition. It seems to occur most often when copying the fonts from ionic-angular, but it can also occur when copying from ionicons. As the font copy from ionicons was added in 0.0.46, I suspect that is the culprit.

For a developer workaround, simply running the app-scripts copy task will eventually get all of your fonts into the www/assets directory (you're usually good after two runs), and the clean task doesn't wipe that directory out. You can add "ionic:copy": "ionic-app-scripts copy" to the "scripts" section of package.json and run npm run ionic:copy to do this.

Fixing this on a build server would either require some scripting or that the bug itself be fixed.

@danbucholtz

I hacked in some code to dump the actual error text to the console.

Results with a clean www directory (manually deleted its contents):

[09:31:46]  ionic-app-scripts 0.0.46
[09:31:46]  copy started ...
[09:31:47]  copy: Error copying "C:\Source\MyApp\node_modules\ionic-angular\fonts" to
            "C:\Source\MyApp\www\assets\fonts" (Error: EEXIST: file already exists, mkdir
            'C:\Source\MyApp\www\assets\fonts')
[09:31:47]  copy finished in 198 ms

Results after a second run, which still contains a populated assets directory (this appears to happen every time the copy task runs after its initial run):

[09:38:08]  ionic-app-scripts 0.0.46
[09:38:08]  copy started ...
[09:38:08]  copy: Error copying "C:\Source\MyApp\node_modules\ionicons\dist\fonts" to
            "C:\Source\MyApp\www\assets\fonts" (Error: ENOENT: no such file or directory, unlink
            'C:\Source\MyApp\www\assets\fonts\ionicons.ttf',Error: ENOENT: no such file or
            directory, unlink 'C:\Source\MyApp\www\assets\fonts\ionicons.woff',Error: ENOENT: no
            such file or directory, unlink 'C:\Source\MyApp\www\assets\fonts\ionicons.woff2')
[09:38:08]  copy finished in 231 ms

I'm on Windows, as usual, but other users seeing this issue are not.

@JustinPierce this seems to be an erratic issues , this is not the only issue, some times watcher fails with the error

[19:35:19] watch failed: watcher error: /home/dhruv/solve-seller/home/dhruv/solve-seller/src/*/.(ts|html|scss):
Error: watch /home/dhruv/solve-seller/src ENOSPC

sometimes it comes with some specific file.

I get error message on mac with "@ionic/app-scripts": "0.0.46" when running ionic run ios, but it seems the fonts are copied over to www/assets/fonts. Deleted www before running.

@JustinPierce I can confirm this is happening on OSX too

ionic info

Your system information:

Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.13
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.46
ios-deploy version: 1.9.0
ios-sim version: 5.0.8
OS: OS X El Capitan
Node Version: v6.9.1
Xcode version: Xcode 8.0 Build version 8A218a

@miguelcarrascoq solution worked for me. (Deleting assets on www)

Deleting wwwdidn't work for me.

In my case, I have a fonts folder inside src/assets with some custom fonts, so when the copy script tries to copy the Ionicons to www/assets/fonts it finds the folder already exists and fails to replace it. It was working well before, so I think the script used to copy the files and not the whole folder.

Deleting www didn't work for me, too.
Revert to 0.45, works fine.

Cordova CLI: Not installed
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.4
Ionic App Lib Version: 2.1.2
Ionic App Scripts Version: 0.0.46
OS: Windows 7 SP1
Node Version: v6.8.1

I'm getting an error message
Excluding www did not work for me.

Your system information:

Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.13
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.46
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 10
Node Version: v6.9.1
Xcode version: Not installed

For windows it is "normal" behavior... I forgot the option, but there some kind of "directory/file" protection during deletion that blocks folder for some time (after deletion started). For posix people it is permission problem.

deleting www did not help me either, here is my setup (weird how the C in Cordova doesn't show):
ordova CLI: 6.3.1
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.13
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.46
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 10
Node Version: v6.7.0
Xcode version: Not installed

@tezcane I want to repeat what I have said: for linux the created www probably was by another user, and that was permission issue -> deleting folder then the correct user/group creates new ones with ionic serve.

But for windows I is completely different story. When I was writing gulp tasks for myself, I have noticed that even gulp.watch is broken when directory is deleted. The process of deletion in Win10, Win7 is so that some service takes control over the folder for a while and do not allow anyone to access it anymore (4 years ago I was managed to find it and deactivate on my machine, but now do not even remember what I have done). But worry not =) This warning just wrong, the directory is recreated and fonts are copied.

It is not an issue of which user created files. I have a project where this message happens consistently, and all files and directories in it are owned by the same user.

Cordova CLI: 6.3.1
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.7
Ionic App Lib Version: 2.1.4
Ionic App Scripts Version: 0.0.46
OS: Linux 4.5
Node Version: v6.9.1

I have got the same problem on Ubuntu Mate 16.04, both with fonts folder and the assests folder itself:

[19:54:03] ionic-app-scripts 0.0.46
[19:54:04] watch started ...
[19:54:04] build dev started ...
[19:54:04] clean started ...
[19:54:04] clean finished in less than 1 ms
[19:54:04] copy started ...
[19:54:04] transpile started ...
[19:54:06] transpile finished in 2.62 s
[19:54:06] webpack started ...
[19:54:07] copy: Error copying "/media/[...]/src/assets" to "/media/[...]/www/assets"
[19:54:07] copy: Error copying "/media/[...]/node_modules/ionicons/dist/fonts" to "/media/[...]/www/assets/fonts"
[19:54:07] copy finished in 3.26 s
[19:54:11] webpack finished in 4.81 s
[19:54:11] sass started ...
[19:54:12] sass finished in 1.44 s
[19:54:12] build dev finished in 8.90 s
[19:54:13] watch ready in 9.01 s
[19:54:13] dev server running: http://localhost:8100/

Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.14
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.46
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Linux 4.4
Node Version: v7.0.0
Xcode version: Not installed

Sometimes it gives assets folder + fonts error, but occasionally it gives only fonts error. Deleting www folder did not help me.

This is a known issue. I am reworking the copy task now as it's insufficient in it's present state. This will be resolved in the coming days. I'll keep you posted.

Thanks,
Dan

@danbucholtz You have probably figured this out by now, but the copy task is failing because there are duplicate files in node_modules/ionicons/dist/fonts/ and node_modules/ionic-angular/fonts/:

  • ionicons.ttf
  • ionicons.woff
  • ionicons.woff2

Remove these from one of the sources and the problem goes away.

(testing 0.0.46)

Thanks @FireCoding

@FireCoding,

Yes, this is resolved in 0.0.47. Thanks,
Dan

FYI: 02.01.2017:
This is STILL showing up on 0.0.47 builds. I just checked it today on one of our apps. I deleted the www/assets/fonts folder and rebuilt and it's fine. It was piking up Times New Roman instead of the Avenir fonts that's on the src/.

This is even happening in 1.0.0 when using ionic package to build. The Roboto font is not copied or used.

I'm getting the same error. Can you help

image

ordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.4
Ionic CLI Version: 2.2.1
Ionic App Lib Version: 2.2.0
Ionic App Scripts Version: 1.0.0
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 10
Node Version: v6.9.1
Xcode version: Not installed

The workaround is to delete the www/assets/fonts and then build and you should have all the fonts picked up in that folder. That's what I'm doing now just as a temporary measure.

That solution isn't working for i18n folder in android environment. Only work fow browser.

Is you see by the image the folder isn't on the android app.

I figure it out!

It was problem of the code, where i was this.translate.setDefaultLang("EN") in upper case, and the files were in lowercase.

In browser it worked well, but in android not, so after setting to lowercase get working.

Thanks

I found this Error, i am using ionic 2 angular 2. whenever use the (ionic serve) Command i found this error.
How to i solve this .

periyasamy@LAP-5CG6326ZB7 ~/ionic_works $ cd sampleApp/
periyasamy@LAP-5CG6326ZB7 ~/ionic_works/sampleApp $ ionic serve

ionic-hello-world@ ionic:serve /home/periyasamy/ionic_works/sampleApp
ionic-app-scripts serve "--v2" "--address" "0.0.0.0" "--port" "8100" "--livereload-port" "35729"

[17:10:26] ionic-app-scripts 1.1.3
[17:10:26] watch started ...
[17:10:26] build dev started ...
[17:10:26] clean started ...
[17:10:26] clean finished in 1 ms
[17:10:26] copy started ...
[17:10:26] transpile started ...
[17:10:28] transpile finished in 2.13 s
[17:10:28] preprocess started ...
[17:10:28] preprocess finished in less than 1 ms
[17:10:28] webpack started ...
[17:10:28] copy finished in 2.27 s
[17:10:34] webpack finished in 6.23 s
[17:10:34] sass started ...
[17:10:35] sass finished in 895 ms
[17:10:35] postprocess started ...
[17:10:35] postprocess finished in less than 1 ms
[17:10:35] lint started ...
[17:10:35] build dev finished in 9.31 s
[17:10:35] watch failed: watcher error:
/home/periyasamy/ionic_works/sampleApp/home/periyasamy/ionic_works/sampleApp/src/assets//,/home/periyasamy/ionic_works/sampleApp/src/index.html,/home/periyasamy/ionic_works/sampleApp/src/manifest.json,/home/periyasamy/ionic_works/sampleApp/src/service-worker.js,/home/periyasamy/ionic_works/sampleApp/node_modules/ionicons/dist/fonts//,/home/periyasamy/ionic_works/sampleApp/node_modules/ionic-angular/fonts//,/home/periyasamy/ionic_works/sampleApp/node_modules/ionic-angular/polyfills/polyfills.js,/home/periyasamy/ionic_works/sampleApp/node_modules/sw-toolbox/sw-toolbox.js:
*
# Error: watch /home/periyasamy/ionic_works/sampleApp/node_modules/ionicons/dist/fonts ENOSPC

[17:10:35] dev server running: http://localhost:8100/

[17:10:36] lint finished in 1.19 s

_Ionic Info_
periyasamy@LAP-5CG6326ZB7 ~/ionic_works/sampleApp $ ionic info

Your system information:

Cordova CLI: 6.5.0
Ionic Framework Version: 2.1.0
Ionic CLI Version: 2.2.1
Ionic App Lib Version: 2.2.0
Ionic App Scripts Version: 1.1.3
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Linux 4.4
Node Version: v6.10.0
Xcode version: Not installed

I had this, solved by deleting the www/assets folder, thanks everyone!

@KeaganFouche I'll check if this really does the thing, thank you.

This isn't working for me. I've deleted the assets folder. After that, I've ran ionic serve -b and saw all fonts being copied to fonts folder. However, when launching ionic cordova run android --device, the folder got updated and all it had after it inside was ionicons.woff and ionicons.woff2.

All other fonts were deleted.

cli packages: (C:\Development\latestnews-ionic\node_modules)

    @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.0
    npm               : 5.3.0
    OS                : Windows 10

This part deleted all fonts:
removed unused font files

Please disregard my latest message. The only "issue" being the errors in browser when debugging on device.

Same issue

ionic ver 3.9.2
cordova ver 7.0.1

I wanted to remove all default fonts and add my own:

I added to package.json
"config": { "ionic_copy": "./config/copy.config.js" },

And added ./config/copy.config.js

module.exports = { // overrides the default copyFonts task from node_modules/@ionic/app-scripts/config/copy.config.js // so that only ionicons are copied (and not roboto and noto-sans fonts) copyFonts: { src: ['{{ROOT}}/src/assets/fonts/**/*'], dest: '{{WWW}}/assets/fonts' } };

ionic build/serve worked as expected
But ionic cordova build created an empty dir at platforms/android/assets/www/assets/fonts/

To fix that I changed to fonts folder under src/assets/fonts to src/assets/ign-fonts

And edited ./config/copy.config.js to:
module.exports = { copyFonts: { src: ['{{ROOT}}/src/assets/ign-fonts/**/*'], dest: '{{WWW}}/assets/fonts' } };

Then I updated all the scss files to reflect the new path.

Now it works though its a bit of a hack.

Update

On IOS the copy script worked and two font folders where created:

  • platforms/android/assets/www/assets/fonts/
  • platforms/android/assets/www/assets/ign-fonts/

I'm also experiencing some issues with this. If I run the build for dev, all files are copied properly:

ionic cordova run android --device --address 192.168.1.24

But if I run with the --prod flag, it only copies the ionicons fonts.

@danbucholtz should this be reopened?

Still an issue when running

ionic cordova emulate android --livereload

no issue when running

ionic serve

ubuntu 16.04
ionic 3.19.0
cordova 7.0.1

I upgraded to

ionic 3.9.2
ionic cli 3.19.0
cordova 7.0.1

and the problem is resolved.

ionic 3.9.2
ionic cli 3.19.0
cordova 7.1.0
app-scripts 3.1.4
Problem stil exists when building for production
ionic cordova build android --device --prod

@danbucholtz ,
Hi,
Dont you think this issue needs to be opened again?

@danbucholtz ,
Hi,
I'm experiencing the exact same issue.
ionic serve => works fine
ionic cordova run android --prod --aot --device => does not work
Error message:
Error: EPERM: operation not permitted, unlink 'C:**wwwassetsfontsionicons'
at Error (native)

Please, this issue clearly needs to be reopened.

$ ionic info
cli packages: (C:\Users**AppData\Roaming\npmnode_modules)
@ionic/cli-utils : 1.19.1
ionic (Ionic CLI) : 3.19.1
global packages:
cordova (Cordova CLI) : 8.0.0
local packages:
@ionic/app-scripts : 3.1.8
Cordova Platforms : android 6.2.3
Ionic Framework : ionic-angular 3.9.2
System:
Node : v6.10.2
npm : 3.10.10
OS : Windows 10

@gabrielrosset Any solution for this?

Looks like Ionic don't care about v3 anymore. Stupid issues like this makes the ionic platform buggy!

Issue solved, it was simply because ionicons and robotto fonts were into project assets and ionic seems not able to deal with project assets sharing the same name than one of its own.

Dear gabrielrosset ,
Please how to solve the issue in real case . What I do to solve the issue ?

Hi flipmedia,
just remove all fonts like ionicons and robotto in your project assets and use the ones from ionic or its modules assets otherwise rename all assets sharing the same name than the ones from ionic or angular.
If like me you created a config/copy.config.js to deal with that case in an older ionic version (overriding the copy process during app building), remove it too.
Cheers.

I've solved the problem of don't copy 'roboto' fonts by changing a line on the node_modules/@ionic/app-scripts/dist/optimization/remove-unused-fonts.js.

Replace: if (fileName.startsWith('noto-sans') || fileName.startsWith('roboto') || (isIonicons(fileName) && !isWoof(fileName))) {
By: if (fileName.startsWith('noto-sans') || (isIonicons(fileName) && !isWoof(fileName))) {

This line was removing all fonts that starts with 'roboto'.

Was this page helpful?
0 / 5 - 0 ratings