I can't link my scss to components in ionic 2 using the standard angular 2 :
styleUrls: ['form.component.scss']
How is it done ?
Ionic2 can take a bit of learning curve as they've redone a lot of how Angular2 works, but once you get used to it it's really fantastic...
For adding scss to components it's super easy, you just throw it into the folder with your TS/html and the ionic build gulp process takes care of the rest for you. So just kill that line for styleUrls and you'll be all set.
It does; however, jack with css inheritance some so you'll want to be careful how you set it up.
Related
With ionic 3 I followed similar guide to this one: https://julienrenaux.fr/2017/07/20/optimized-ionic-angular-css-bundle-for-pwas/ and in fact achieved great bundle size reduction (by allowing only one platform style to be bundled + removing unused components code).
Question:
with Ionic 4 changes and lazy loading for components do we get this "for free" now and we do not have to worry about such tricks?
ionic g page SomePage also creates some-page.module.ts file. How do I prevent it from doing it?
I use Ionic 4
In Ionic v3, it is possible to use `--no-module`` flag, to skip the creation of module.ts file.
Try execute:
ionic g page SomePage --no-module
Hope this helps!
We shouldn't delete module from a page.
Page in Ionic is ment to represent the whole view, because there is also a Component which might be just a part of the view. So it is very obvious now, that every Page should have its module (for lazy loading) and a route to it.
If we generate component, we see that neither - module nor route is created, so it makes perfect sense now.
Hi Everyone,
My name is Kris Chery. I am new to ionic and am using version 2.1.18. I have been following this tutorial which I think is very insightful about the powers of ionic.
https://www.joshmorony.com/an-in-depth-explanation-of-providers-in-ionic-2/
I am stuck at the ionicBootstrap implementation. For now its a simple service that needs to display a message but for some reason. I can't seem to import ionic Bootstrap it is saying that ionicBoostrap wasn't exported from node modules.
This is information is imperative for me to my dream app. Any help would be much appreciated.
UPDATE: I have done a number or research on the matter but none led to a good explanation on how to fix it or to implement it properly.
I'd recommend not using that tutorial and using the official Angular docs instead. That was written back in July. Back then Angular 2 was only in RC phase and Ionic 2 was still in beta. A lot has changed since then.
You don't want to use bootstrapping for this, your app already does it's bootstrapping in app.ts. Instead in app.module.ts you can import other module and declare providers.
Angular 2 Tutorial: https://angular.io/docs/ts/latest/tutorial/
Bootstrapping and modules: https://angular.io/docs/ts/latest/guide/ngmodule.html#!#bootstrap
I want to use the Ionic UI framework with Trigger.io for my hybrid mobile app, but it isn't clear to me just how to combine the two in my code because it's not like using Jquery where you just add the library to a script tag.
After install, both of these frameworks provide their own "hello world" type of index.html file, their own css and js files as well as framework specific configuration files which I know are important. So which one do I use as a base and how do I call into the other framework from that base? How do I structure the project file tree to combine the two so that when I go to do an app build for distribution, there isn't some crazy error because the frameworks are set up to look for their own files via set paths?
Here is one answer I found in my googling.
What steps do I need to take to use the Ionic Framework with trigger.io?
here is an example project on git hub:
https://github.com/travisrussi/ionic-triggerio
here is the link to the ionic cdn to be used for testing:
https://code.ionicframework.com/#
I would like to optimize the loading time of my website which is built on Chaplin + brunch (coffeescript).
How could I pack everything so that only one js file would be seen / loaded by the browser ?
It is mainly a workflow question, I don't know if this can be achieved by brunch itself or if I should rely on an external package such as webpack or even jspm.
That does it: config.files.javascripts.joinTo = 'app.js'
http://brunch.io/docs/config#-files-