runisland:ionic4
Meteor Atmosphere package that automatically imports Ionic4 Web Components (i.e. @ionic/core) into your Client templates.
Quick Guide
- Add this package to your Meteor project:
meteor add runisland:ionic4
That is it!
Test on mobile device
If you want to access your development machine localhost from another machine (typically from a mobile device),
you must explicitly specify the ROOT_URL
environment variable:
Linux or macOS:
$ ROOT_URL="http://<ip-address>:<port>" meteor run
Windows:
$ set ROOT_URL="http://<ip-address>:<port>" && meteor run
where:
<ip-address>
is the IP of your dev machine (e.g.192.168.1.10
)<port>
is the port of your localhost (typically3000
)
Example apps
-
With Blaze:
- Live demo (only client assets, no server, therefore routing is not fully functional)
- Source code
-
With Vue:
- Live demo (only client assets, no server, therefore routing is not fully functional)
- Source code
How does it work?
The package automatically bundles the @ionic/core
loader into your Meteor App, exposes Ionic assets, and tells the loader where to find them.
Yep, starting with version 4, Ionic has its own lazy-loading mechanism.
Therefore there is nothing else to import
in your app.
Ionic4 will Just WorkTM, whether you use Blaze, React, Vue, Angular, etc.
Custom tags configuration
Note that you may still need to configure your template engine so that it knows what to do with Ionic's custom tags (you probably just want the engine to ignore them).
For example in Vue:
1// Ignore tags that start with "ion-" 2Vue.config.ignoredElements = [/^ion-/];
Blaze uses a different component syntax ({{> myComponent}}
), therefore it does not interfere with Ionic4 Web Components (like <ion-app>
).
As a consequence there is nothing to configure if you use Blaze.
Build
Go to the package
subfolder and build:
$ cd package $ npm run build
Overriding with a local version
Cf. Overriding published packages with a local version
- Create a
packages
folder at the root of your Meteor project. - Create a subfolder in it to host your local version of this package. E.g. name it "
meteor-ionic4
". - Copy the content of the
package
subfolder of therunisland:ionic4
package repository into this "meteor-ionic4
" subfolder. - Navigate to this subfolder and execute the build script, so that it retrieves the Ionic4 assets:
$ cd packages/meteor-ionic4 $ npm run build
If you want to load a different version of @ionic/core
(e.g. if the package author no longer updates it in the Atmosphere registry),
simply update the version in devDependencies
field of the package.json
file, then re-run the build script.
License
runisland:ionic4
is distributed under the MIT License (Expat type), like Ionic and Meteor.