How to use Yarn instead of Bower, and import them as dep in angular app?

[philonor]

@tomavic https://github.com/ionic-team/ionic/issues/10647 might give some starting point

[tomavic]

@philonor thanks for that but it's seems like it's related to ionic >3.x . I need to use for ionic 1.x

[jacquesdev]

Hi @tomavic - if you do find anything on this please do let me know. I have tried two related things, but neither of them worked.

First - if we for the moment just say that yarn === npm, I have not been able to switch from bower to npm because with bower you can specify an install directory (ie something within www), and with npm you cannot seem to do that, you are stuck with files being installed into node_modules. I did look at adding a symlink node_modules from within www, but it seems to drastically slow the app down, I guess since it's checking the massive node_modules folder as opposed to just the plugins you want to use for your app installed at www/lib for example. See here: https://stackoverflow.com/questions/48525732/install-npm-packages-to-a-custom-local-directory

Then - the second issue is switching npm out for yarn (since I believe npm is hard-coded into cordova), so making this change is currently impossible - check this thread here - https://stackoverflow.com/questions/41125428/how-can-i-get-cordova-to-use-yarn-js-instead-of-npm-for-adding-plugins and https://issues.apache.org/jira/browse/CB-12242.

Finally, ionic 1 is getting no or very limited attention from the ionic team, so, unfortunately, it makes things tricky for us devs who need to continue with it going forward.

[tomavic]

Hi @jacquesdev

Thanks a ton!! I had been thinking for a long-time and you make me sure about my concerns. I think there should be someone from ionic1-team look into this

[814k31]

I'm in the process of getting this to work through npm if this example will help

I came accross this example which uses the npm package ionic-sdk and imports like so: https://github.com/ModusCreateOrg/ionic-seed

import 'angular/angular';
import 'angular-animate/angular-animate';
import 'angular-sanitize/angular-sanitize';
import 'ionic-sdk/release/js/angular-ui/angular-ui-router';
import 'ionic-sdk/release/js/ionic';
import 'ionic-sdk/release/js/ionic-angular';

The downfall to ionic-sdk is that the latest version is ionic v1.3.2

I was looking around and found you can swap to ionic-angular@1.3.5 But this repo only includes the release folder in the repo and therefore has css instead of scss which is forcing me to have the styles in the project order of

fonts/
style/styles.css

because of https://github.com/ionic-team/ionic-v1/blob/master/release/css/ionic.css#L26

So... if you don't mind not have the latest version give ionic-sdk a try

[tomavic]

I think it's a bad Idea, and We should keep using bower 😞