Friday, November 20, 2015

"could not find inappbrowser plugin" when using ngCordova and Ionic

You will probably get the error when you have installed Cordova v5.4.0 . To solve the issue downgrade your Cordova to v5.3.3 . Also you can follow https://github.com/nraboy/ng-cordova-oauth/issues/57 to get more updates on the issue.

How to downgrade Cordova can be found in my blog http://rakesh1988.blogspot.sg/2015/11/downgrading-cordova-installing-older.html

Cheers!!!

Thursday, November 19, 2015

Downgrading Cordova / Installing older Cordova version

Have you run into a situation where you upgraded Cordova and your application broke due to a third party plugin???
Here are the steps to install previous version of Cordova
  • cordova -v  would tell you the current version of cordova installed.
  • npm info cordova  would tell you the available versions of cordova in npm.
  • Suppose you want to install  v 5.3.3 then just follow the below commands
    • npm uninstall -g cordova  This will uninstall the current cordova verison
    • npm install -g cordova@5.3.3 This will install the version 5.3.3
  • Then you need to update your application to point to new cordova
    • cordova platform update android
    • cordova platform update ios
  • You can also update ionic as below
    • ionic lib update

Adding Font Awesome to your Ionic project


To add Font Awesome (https://fortawesome.github.io/Font-Awesome/) to your ionic project here are the steps that I followed


Prerequisites
  1. node.js installed (v 5.1.0)
  2. Ionic (v 1.7.10)
  3. npm (v 3.3.12)
  4. bower (v 1.6.5)
  5. install gulp locally using, “npm install gulp”
To install Font Awesome, navigate to your Ionic’s parent directory and use the below bower command
  • bower install fontawesome -s
Above command will place all the files relates to Font Awesome in www/lib (because this is defined in .bowerrc file) directory and update bower.json file with the details of this dependency.

Next, we need to update @fa-font-path variable in www/lib/font-awesome/scss/_variables.scss

$fa-font-path:        "../lib/font-awesome/fonts" !default;

Next, we need to update Ionic’s SCSS file to import Font Awesome. Add below into scss/ionic.app.scss

@import "www/lib/font-awesome/scss/font-awesome"; 

Next, run gulp sass task. This will merge ionic’s CSS and Font Awesome’s CSS. Then, change the index.html to point <link href="css/ionic.app.css" rel="stylesheet"> and remove/comment Ionic’s stylesheet <link href="lib/ionic/css/ionic.css" rel="stylesheet">

Test Font Awesome
<i class="fa fa-google"></i>