Signup for the Ionic Newsletter to get the latest news and updates!

  • Ankush Aggarwal

    as you said, we can disable the plugins line. How would I use sqlite plugin or @ionic/storage? Do I need to include cordova.js for that?

    • Marouan Frih

      you can use ionic storage without sqlite for the web (you can use Storage when you’re on ‘ionic serve’, so yeah 🙂 )

  • João Vitor Paes de Barros

    The trouble with removing cordova.js is that some ionic plugins not work properly without it.
    There are some decision to be made about build a Ionic PWA, to use cordova (browser platform) and the plugins works or just not use cordova and some plugins don’t work.
    Maybe the plugins should work on web regardless of cordova? Or the ionic build system should always use cordova with platform browser?
    From my perspective, the plugins should work regardless of cordova. Even because of cordova principle was to be just a polyfill for the web.

  • https://www.facebook.com/app_scoped_user_id/705515260/ Nicolas Durand

    This is great news, and one of the reasons I picked Ionic (to have a single code base).

    However (and sorry if I missed it in your excellent blog post), when I run npm run ionic:build — –prod, it indeed compiles and creates files in the www folder, but when I open www/index.html, it is empty.

    How can I have my nice application (that is all under src/app, src/pages, etc) appear?
    My app is built on the Tutorial app, and specifies
    export const FirstRunPage = ‘HomePage’
    in /src/pages/pages.ts

    Any help would be greatly appreciated.

  • Mr.Floppy

    If I deploy my app in the way you just described, the cordova plugins don’t work, right?
    Does it makes sense to deploy the app as the browser plaftorm? Basically like this:
    ionic cordova platform add browser
    ionic cordova build browser –prod
    And then upload the folder [project]plaftormsbrowserwww
    If so, does the service worker work as well?
    Are there any traps I could run into? Or is there anything I have to consider by doing it this way?

  • Abu Nj

    what is the difference between PWA and electron app ?

  • Owa

    How will routing work in Ionic going forward?

    Routing is a major headache for PWAs built in ionic,

    Its difficult to implement things like AuthGuards etc, and it seems Ionic doesnt adapt Angulars routing

    • Ratikanta

      I do not have idea about AuthGuards but normally the Routing works fine as it is in cordova app.

  • http://www.artansoft.com/ Raul Torralba Adsuara

    I’m making some tests with a PWA with ionic, are there any component for AdSense or other advertisement system for PWA?

  • Samuel Faucher

    Thanks for the article, looking forward to build an PWA using Ionic

  • Cattaneo Pablo

    Hi! Great post! And thank you for doing of Ionic a great framework! I’m trying to create a PWA and a hybrid app width the same code, so after run npm run ionic:build — –prod I have the next issue:

    ionic-app-script task: “build”
    [09:39:43] Error: Type CategoriesPage in
    /home/pablo/projects/basic_login_and_logout_firebase/src/pages/categories/categories.ts is part of the
    declarations of 2 modules: AppModule in
    /home/pablo/projects/basic_login_and_logout_firebase/src/app/app.module.ts and CategoriesPageModule in
    /home/pablo/projects/basic_login_and_logout_firebase/src/pages/categories/categories.module.ts! Please
    consider moving CategoriesPage in
    /home/pablo/projects/basic_login_and_logout_firebase/src/pages/categories/categories.ts to a higher module
    that imports AppModule in /home/pablo/projects/basic_login_and_logout_firebase/src/app/app.module.ts and
    CategoriesPageModule in
    /home/pablo/projects/basic_login_and_logout_firebase/src/pages/categories/categories.module.ts. You can also
    create a new NgModule that exports and includes CategoriesPage in
    /home/pablo/projects/basic_login_and_logout_firebase/src/pages/categories/categories.ts then import that
    NgModule in AppModule in /home/pablo/projects/basic_login_and_logout_firebase/src/app/app.module.ts and
    CategoriesPageModule in
    /home/pablo/projects/basic_login_and_logout_firebase/src/pages/categories/categories.module.ts.
    Error: Type CategoriesPage in /home/pablo/projects/basic_login_and_logout_firebase/src/pages/categories/categories.ts is part of the declarations of 2 modules: AppModule in /home/pablo/projects/basic_login_and_logout_firebase/src/app/app.module.ts and CategoriesPageModule in /home/pablo/projects/basic_login_and_logout_firebase/src/pages/categories/categories.module.ts! Please consider moving CategoriesPage in /home/pablo/projects/basic_login_and_logout_firebase/src/pages/categories/categories.ts to a higher module that imports AppModule in /home/pablo/projects/basic_login_and_logout_firebase/src/app/app.module.ts and CategoriesPageModule in /home/pablo/projects/basic_login_and_logout_firebase/src/pages/categories/categories.module.ts. You can also create a new NgModule that exports and includes CategoriesPage in /home/pablo/projects/basic_login_and_logout_firebase/src/pages/categories/categories.ts then import that NgModule in AppModule in /home/pablo/projects/basic_login_and_logout_firebase/src/app/app.module.ts and CategoriesPageModule in /home/pablo/projects/basic_login_and_logout_firebase/src/pages/categories/categories.module.ts.
    at syntaxError (/home/pablo/projects/basic_login_and_logout_firebase/node_modules/@angular/compiler/bundles/compiler.umd.js:1550:34)
    at CompileMetadataResolver._addTypeToModule (/home/pablo/projects/basic_login_and_logout_firebase/node_modules/@angular/compiler/bundles/compiler.umd.js:14655:31)
    at /home/pablo/projects/basic_login_and_logout_firebase/node_modules/@angular/compiler/bundles/compiler.umd.js:14543:27
    at Array.forEach ()
    at CompileMetadataResolver.getNgModuleMetadata (/home/pablo/projects/basic_login_and_logout_firebase/node_modules/@angular/compiler/bundles/compiler.umd.js:14534:54)
    at addNgModule (/home/pablo/projects/basic_login_and_logout_firebase/node_modules/@angular/compiler/bundles/compiler.umd.js:23050:58)
    at /home/pablo/projects/basic_login_and_logout_firebase/node_modules/@angular/compiler/bundles/compiler.umd.js:23061:14
    at Array.forEach ()
    at _createNgModules (/home/pablo/projects/basic_login_and_logout_firebase/node_modules/@angular/compiler/bundles/compiler.umd.js:23060:26)
    at analyzeNgModules (/home/pablo/projects/basic_login_and_logout_firebase/node_modules/@angular/compiler/bundles/compiler.umd.js:22935:14)

    I get this error only when I run npm run ionic:build — –prod but not with ionic serve and that is what I don’t understand. I searched in the web and there are a couple of solutions that probably works but none of them explains why happen this problem so I’m afraid to implements this changes and then breake the app as hybrid app.

  • Terence O’Donoghue

    Apart from the scenario where the developer wants a single code base for mobile and web, what benefits does the developer get when using Ionic2 instead of just Angular4 for web?

    • Daniel Martin

      Platform specific UI components are one benefit

  • Rodrigo Rubio

    Guys? is there a way to check via a PWA if device supports “NFC”?

    Cheers, Rodrigo

  • Jose Vicente de Sousa

    I love ionic and angular