Where is Storage and LocalStorage in rc0?

Hey @alejandrocao, I finished my migration and localforage seems to work fine for me. If I reckon I did

-Installlocal forage:

 sudo npm install localforage --save

-Install definition

sudo npm install @types/localforage --save 

-As I already mentioned (see above), no more * in import and it’s important to not forget to specify the types (like getItem and setItem) when you use the library

Let me knows if these steps worked for you too, hope so

1 Like

Here is what I did to make it work:

  • Enlisted Storage in app.module providers array:
@NgModule({  providers: [.., Storage]
  • Extended node_modules\@ionic\app-scripts\config\rollup.config.js:
plugins: [
    builtins(),
    commonjs({
      include: [       
        'node_modules/rxjs/**',
        'node_modules/firebase/**',
        'node_modules/angularfire2/**',
        'node_modules/localforage/**'
      ],

I think node_modules/@types/localforage was already installed by ionic. Although it works it feels kinda hacky so I’m still interested in the proper solution for this.

2 Likes

I had the same issue you had, your solution worked for me, Thanks!!:clap::raised_hands:

1 Like

I was able to resolve this using localForage directly. See my post.

As @gasaki already mentioned you should use @ionic/storage.
This uses LocalForage when running in a desktop browser only if no “better” option is available or e.g. SQLite when running on a device.
Here is the description:

/**

  • Storage is an easy way to store key/value pairs and other complicated
  • data in a way that uses a variety of storage engines underneath. Currently,
  • Storage uses localforage underneath to abstract away the various storage
  • engines while still providing a simple API.
  • When running natively, Storage will prioritize using SQLite, as it’s one of
  • the most stable and widely used file-based databases, and avoids some of the
  • pitfalls of things like localstorage that the OS can decide to clear out in
  • low disk-space situations.
  • When running in the web or as a Progressive Web App, Storage will attempt to use
  • IndexedDB, WebSQL, and localstorage, in that order.
    */

I’d like to note that you can avoid the neccessity of editing the rollup.config.js in the node_modules by
creating a rollup.config.js and mention it in package.json like the Ionic conference app does.

I would love to use @ionic/storage, but I would always get the error (see my original post)

main.js:3427 Error: No provider for Storage!

And I couldn’t figure out how to get past it.

I just realized I never included Storage in my app.module.ts file? And this is exactly what @apreg mentioned. :slight_smile:

I was able to implement the Ionic2 Storage too. Since I posted here above a solution with LocalForage, here how I switched to Storage:

1_Remove localforage

sudo npm remove localforage --save

2_Remove localforage typescript definition

sudo npm remove @types/localforage --save-dev

3_Install (or install again) the Ionic storage

sudo npm install @ionic/storage --save --save-exact

4_As @apreg pointed out, declare Storage in your providers of app.modules.ts

import { Storage } from '@ionic/storage';

...

@NgModule({
   ...
  providers: [Storage]
})

5_Change or create your code

 import {Injectable} from '@angular/core';
 import {Storage} from '@ionic/storage';
 
 @Injectable()
 export class MyService {
  
      constructor(public storage:Storage) {
     }
  
    save(data: any): Promise<any> {
       return this.storage.set('my_key', data);
    }
  
   retrieve(): Promise<any> {
    return this.storage.get('my_key');
   }

    clear(): Promise<void> {
    return this.storage.clear();
  }

}

P.S.: References

1 Like

Thanks for the info @reedrichards. I followed your steps and it works great in the browser. Unfortunately on my Android, some analytics is failing with Invalid action (it almost looks unrelated, but this is the error I get every time I try to access the db)

11-07 20:45:15.638 10419 10419 D SystemWebChromeClient: file:///android_asset/www/plugins/cordova-sqlite-storage/www/SQLitePlugin.js: Line 175 : OPEN database: _ionicstorage
11-07 20:45:15.639 10419 10419 I chromium: [INFO:CONSOLE(175)] “OPEN database: _ionicstorage”, source: file:///android_asset/www/plugins/cordova-sqlite-storage/www/SQLitePlugin.js (175)
11-07 20:45:15.643 10419 10666 V SQLitePlugin: Android db implementation: built-in android.database.sqlite package
11-07 20:45:15.645 10419 14481 V info : Open sqlite db: /data/user/0/com.directoryontap/databases/_ionicstorage
11-07 20:45:15.649 10419 10419 D SystemWebChromeClient: file:///android_asset/www/plugins/cordova-sqlite-storage/www/SQLitePlugin.js: Line 106 : new transaction is waiting for open operation
11-07 20:45:15.649 10419 10419 I chromium: [INFO:CONSOLE(106)] “new transaction is waiting for open operation”, source: file:///android_asset/www/plugins/cordova-sqlite-storage/www/SQLitePlugin.js (106)
11-07 20:45:15.788 10419 10419 D SystemWebChromeClient: file:///android_asset/www/plugins/cordova-sqlite-storage/www/SQLitePlugin.js: Line 179 : OPEN database: _ionicstorage - OK
11-07 20:45:15.788 10419 10419 I chromium: [INFO:CONSOLE(179)] “OPEN database: _ionicstorage - OK”, source: file:///android_asset/www/plugins/cordova-sqlite-storage/www/SQLitePlugin.js (179)
11-07 20:45:15.789 10419 10419 D SystemWebChromeClient: file:///android_asset/www/plugins/cordova-sqlite-storage/www/SQLitePlugin.js: Line 80 : DB opened: _ionicstorage
11-07 20:45:15.789 10419 10419 I chromium: [INFO:CONSOLE(80)] “DB opened: _ionicstorage”, source: file:///android_asset/www/plugins/cordova-sqlite-storage/www/SQLitePlugin.js (80)
11-07 20:45:15.866 10419 10666 W CordovaPlugin: Attempted to send a second callback for ID: UniversalAnalytics929104835
11-07 20:45:15.866 10419 10666 W CordovaPlugin: Result was: “Invalid action”

Just realized my problem, which is the typical problem with errors which occur when starting: waiting until the platform is ready.

this.platform.ready().then(() => {
    this.storage.get(this.STORE_EMAIL_KEY)
    ....
});
1 Like

Glad to hear you made it, well done!

1 Like

Hi I’m still having an issue where its asking me to include Storage in the providers for each page? I don’t understand where I’ve gone wrong. Can anyone help?

You have an import of ‘@ionic/Storage’. Might that upper-case ‘S’ be causing your problem?