Here is a basic demo app I made to show the use of Leaflet with Mapbox tiles in an Ionic 2 app.
The full code for this project can be found on github
You can add a simple leaflet map to any Ionic 2 app easily in just a few steps.
First we need to install leafletjs and its typing
npm install leaflet --save
typings install dt~leaflet --global --save
Add leaflet to
declare module '*'; //you should already have this
declare module 'leaflet'; //you must add this
Setup leaflet CSS and Images
copy images folder and leaflet.css from
cp -a node_modules/leaflet/dist/images www/assets/
cp node_modules/leaflet/dist/leaflet.css www/assets/
then import leaflet.css in your
Add a leaflet map to any page
Here we add leaflet to a blank page called home which is the default in a blank app generated by the ionic-cli
Page HTML & SCSS
Add the map and remove padding from ion-content
Edit your page SCSS to make sure the leaflet map fills the frame and doesn’t scroll.