Where is Storage and LocalStorage in rc0?

Storage now exporting but LocalStorage doesn’t. What the name for it now?

yeah same problem here… really don’t hope they went and removed it that would suck!

LocalStorage seemed like a thin wrapper around LocalForage anyway. You could try using LocalForage directly.

thanks @rapropos,

do i just replace all LocalStorage with LocalForage??

I haven’t needed to do this yet, so I can’t say for sure. You will probably need to install @types/localforage and import localforage from 'localforage' at a minimum to get started.

1 Like

@rapropos you sir deserve a very cold and large beer!

Thanks it worked!

for @theromis heres what i did:

install it:

npm install @types/localforage npm install localforage

import it:

import * as localforage from "localforage";

and then change set, get remove, clear to their new values,

example:

localforage.setItem('key', 'value' );

github: https://github.com/localForage/localForage
api doc: https://localforage.github.io/localForage/

2 Likes

Ionic Team is LocalStorage supported in RC0?

1 Like

I’m digging into this too. Actually there is no need to install localforage. Like @rapropos said, LocalStorage uses LocalForage.

I imported Storage from @ionic/storage and used the same way you are using localforage, but the syntax is a bit different. Instead of:

localforage.setItem('key', 'value' );

use:

storage.set('key', 'value');

The same for getItem and get.

2 Likes

yeah saw that too.

but it’s either importing Storage or installing localforage.

Seeing as they dropped LocalStorage from ionic i believe it’s a safer bet to use localforage on its own… but thats just a personal choice.

2 Likes

when I do

 import * as localforage from "localforage";

[21:40:11] rollup: Export ‘config’ is not defined by …
[21:40:11] rollup: Export ‘setItem’ is not defined by …
[21:40:11] rollup: Export ‘getItem’ is not defined by …
[21:40:11] rollup: Export ‘clear’ is not defined by …

and when I do

import localforage from 'localforage';

I didn’t face error in the tray but it seems to didn’t work.

any idea?

1 Like

So I remember (now) that importing Localforage didn’t work, that’s why I used to have to set it as required, like this

declare let require: Function;

const localforage: LocalForage = require('localforage');

but when I do this, at runtime, I’ve got the error

file.js:11 Uncaught ReferenceError: require is not defined

any idea?

Got it (I like to answer my self :wink:

Import as to be done like following :slight_smile:

import localforage from 'localforage';

Important, when you use setItem and getItem don’t forget to add the type of the object to save!

   localforage.setItem<any>('key', object);
   localforage.getItem<any>('key');

Of course replace with your type or let as you want.

Compilation is now ok, running with ionic serve is ok too and I confirm that in debug I see my informations into IndexedDB

P.S.: And for those who use localstorage

From release notes:

Storage has been removed from ionic-angular and placed into a separate module, @ionic/storage. Starters have been updated to add this, make sure to add it to your package.json if you’re using the storage system. See more details here.

=>

 https://github.com/driftyco/ionic/blob/master/CHANGELOG.md#storage
2 Likes

This did not seem to work for me.

what’s the error you get?

I am getting the following error:

[03:04:28]  Error: Module c:\Projects\POC1\node_modules\localforage\dist\localforage.js does not export default (imported by c:\Projects\POC1\node_modules\@ionic\storage\es2015\storage.js)                                                          
    at Module.trace (C:\Projects\POC1\node_modules\rollup\dist\rollup.js:7677:29)                                          
    at ModuleScope.findDeclaration (C:\Projects\POC1\node_modules\rollup\dist\rollup.js:7300:22)                           
    at Scope.findDeclaration (C:\Projects\POC1\node_modules\rollup\dist\rollup.js:5351:39)                                 
    at Scope.findDeclaration (C:\Projects\POC1\node_modules\rollup\dist\rollup.js:5351:39)                                 
    at Identifier.bind (C:\Projects\POC1\node_modules\rollup\dist\rollup.js:6489:29)                                       
    at C:\Projects\POC1\node_modules\rollup\dist\rollup.js:5151:50                                                         
    at AssignmentExpression.eachChild (C:\Projects\POC1\node_modules\rollup\dist\rollup.js:5168:5)                         
    at AssignmentExpression.bind (C:\Projects\POC1\node_modules\rollup\dist\rollup.js:5151:7)                              
    at AssignmentExpression.bind (C:\Projects\POC1\node_modules\rollup\dist\rollup.js:5511:23)                             
    at C:\Projects\POC1\node_modules\rollup\dist\rollup.js:5151:50
1 Like

I may have gotten around this by adding this to a custom rollup config:

plugins[
  commonjs({
    include: {
      'node_modules/localforage/**'
   }
 })
]

Still have other issues so can’t confirm yet.

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.