Ionic 2 - no icons

Hi guys,

I created a blank project with ionic start example --v2 and after it I just ionic serve. It bugged out the first time, but the second it ran ok - except when looking at the browser, it tries to download some files it doesnt exist in the project itself: https://puu.sh/rsKpN/e26a1a78c8.png

I know those files are from ionicons and thats why they aren’t showing… any news on this?

I’m working in Windows 10, nodejs prompt 6.7 npm 3.10.3, just installed ionic and cordova (so I believe they are the latest, 2.1.0 and 6.3.1 respectivelly).

Thanks in advance

Hi,

I got the same problem on Win10 since I upgraded to 2.0.0-rc.0.

Your system information:
Cordova CLI: 6.3.1
Gulp version:  CLI version 3.9.1
Gulp local:
Ionic Framework Version: 2.0.0-rc.0
Ionic CLI Version: 2.1.0
Ionic App Lib Version: 2.1.0-beta.1
OS:
Node Version: v4.5.0

Thanks for all the hard work for the 2.0 release.

Best regards!

What can fix some icons is to manually download the fonts and putting them in scr/fonts folder. But even then, it tries to get some glyphs that aren’t there yet: https://puu.sh/rsM3L/7172b5c0aa.png and the glyphs it loads aren’t really the correct ones https://puu.sh/rsM4l/17eaa9181b.png

So, got it working.

I just checked all my outdated global npm packages via npm outdated -g and upgraded them using npm install -g PACKAGE.
I also upgraded npm from 3.10.7 to 3.10.8 and NodeJS from 4.5.0 to 4.6.0.

Hope it helps somebody. :slight_smile:

Best regards!

fonts should be in src/assets/fonts under RC.0

@mvrc Yes but they aren’t there. There is no fonts folder anywhere. I see that inside node_modules, ionicons is there but I have no clue how to manually import it into the project (and sass files like $ionicons-font-path: "../assets/fonts"; @import "ionicons";). Any inputs @ this?

@axelino This didn’t help me. I have no outdated package. Is this because I’m in Windows? I’m going to test it in OS X.

Oh, okay, sorry.
Did you uninstall ionic@beta to reinstall just ionic for the latest ionic-CLI ?
The fonts are automatically loaded from ionic-angular.

@mvrc I didn’t have ionic@beta, in fact I just installed node in this machine so everything is new.

@rafabsides Sorry to hear that. I see you’re using NodeJS 6.7. I had problems with this in earlier Ionic 2 beta versions. I switched to 4.X LTS release and it was working fine. Maybe you give it a try.

@axelino I’m trying in OS X first but I’ll also try that. I’ll post back as soon as I get the results. Thank you :slight_smile:

EDIT: I can confirm that in OS X they all work fine. The only difference from Windows is node version so I’ll try that one and see how it goes.

Cordova CLI: 6.3.1
Gulp version:  CLI version 1.2.2
Gulp local:
Ionic Framework Version: 2.0.0-rc.0
Ionic CLI Version: 2.1.0
Ionic App Lib Version: 2.1.0-beta.1
ios-deploy version: 1.8.6
ios-sim version: 5.0.8
OS: Mac OS X El Capitan
Node Version: v6.4.0
Xcode version: Xcode 7.3.1 Build version 7D1014

Thanks for all the help so far!

Tried again in Windows, with nodejs 4.6.0 - the error is worse unforntunatelly :frowning:

Cordova CLI: 6.3.1
Gulp version:  CLI version 3.9.1
Gulp local:
Ionic Framework Version: 2.0.0-rc.0
Ionic CLI Version: 2.1.0
Ionic App Lib Version: 2.0.0-beta.20
OS:
Node Version: v4.6.0
Running 'serve:before' npm script before serve
> homeapp@ watch D:\Projects\homeapp
> ionic-app-scripts watch
[08:05:01]  ionic-app-scripts 0.0.23
[08:05:01]  watch started ...
[08:05:01]  build dev started ...
[08:05:01]  clean started ...
[08:05:01]  clean finished in 3 ms
[08:05:01]  copy started ...
[08:05:01]  typescript compiler started ...
[08:05:01]  lint started ...
[08:05:01]

[08:05:01]  copy finished in 108 ms
[08:05:04]  src/app/app.component.ts(1,27): error TS2307: Cannot find module '@angular/core'.
[08:05:04]  src/app/app.module.ts(1,26): error TS2307: Cannot find module '@angular/core'.
[08:05:04]  src/app/main.dev.ts(1,40): error TS2307: Cannot find module '@angular/platform-browser-dynamic'.
[08:05:04]  src/pages/about/about.ts(1,27): error TS2307: Cannot find module '@angular/core'.
src/pages/contact/contact.ts(1,27): error TS2307: Cannot find module '@angular/core'.
[08:05:04]  src/pages/home/home.ts(1,27): error TS2307: Cannot find module '@angular/core'.
[08:05:04]  src/pages/tabs/tabs.ts(1,27): error TS2307: Cannot find module '@angular/core'.
[08:05:04]  typescript compiler ready in 3.40 s
[08:05:04]  bundle dev started ...
[08:05:05]  Error: Could not resolve '@angular/platform-browser-dynamic' from D:\Projects\homeapp\.tmp\app\main.dev.js
    at Error (native)
    at D:\Projects\homeapp\node_modules\@ionic\app-scripts\node_modules\rollup-plugin-node-resolve\dist\rollup-plugin-node-resolve.cjs.js:78:21
    at D:\Projects\homeapp\node_modules\@ionic\app-scripts\node_modules\rollup-plugin-node-resolve\node_modules\browser-resolve\index.js:265:24
    at D:\Projects\homeapp\node_modules\@ionic\app-scripts\node_modules\rollup-plugin-node-resolve\node_modules\resolve\lib\async.js:46:14
    at process (D:\Projects\homeapp\node_modules\@ionic\app-scripts\node_modules\rollup-plugin-node-resolve\node_modules\resolve\lib\async.js:173:43)
    at ondir (D:\Projects\homeapp\node_modules\@ionic\app-scripts\node_modules\rollup-plugin-node-resolve\node_modules\resolve\lib\async.js:188:17)
    at load (D:\Projects\homeapp\node_modules\@ionic\app-scripts\node_modules\rollup-plugin-node-resolve\node_modules\resolve\lib\async.js:69:43)
    at onex (D:\Projects\homeapp\node_modules\@ionic\app-scripts\node_modules\rollup-plugin-node-resolve\node_modules\resolve\lib\async.js:92:31)
    at D:\Projects\homeapp\node_modules\@ionic\app-scripts\node_modules\rollup-plugin-node-resolve\node_modules\resolve\lib\async.js:22:47
    at FSReqWrap.oncomplete (fs.js:82:15)

[08:05:05]  sass started ...
[08:05:07]  sass finished in 1.85 s
[08:05:07]  build dev failed:  Build failed

[08:05:07]  watch ready in 5.71 s
Running live reload server: http://localhost:35729
Watching: www/**/*, !www/lib/**/*
√ Running dev server:  http://localhost:8100
Ionic server commands, enter:
  restart or r to restart the client app from the root
  goto or g and a url to have the app navigate to the given url
  consolelogs or c to enable/disable console log output
  serverlogs or s to enable/disable server log output
  quit or q to shutdown the server and exit

ionic $ q

EDIT: with nodejs 5.12, same error with icons as in 6.4 unfortunatelly.

EDIT2: Rebuilt (ionic serve) the app one more time and voila, it works. So, for future reference for Windows 10 users, Node 5.12.x is the best choice. Thanks for all the help guys.

EDIT #3: Well it still gives errors now and then and I should warn you that it’s currently impossible to be stable at Windows 10 right now. I changed the platform so I dont have to handle with it anymore.

I’m having the same issue and it looks there is an issue