quasar: [v1] `import { LocalStorage } from 'quasar' in boot file returns object without getItem()

Describe the bug

Hello, I’m using LocalStorage in a boot file w/ v1.

I get this error when trying to call getItem() “quasar_src_plugins_LocalStorage_js__WEBPACK_IMPORTED_MODULE_1__.default.getItem is not a function”

This is new behavior - this code was working previously.

module.exports = function (ctx) {
  return {
    // app boot file (/src/boot)
    // --> boot files are part of "main.js"
    boot: [
      'feathers',
    ],

Then in feathers.js, I’m importing from quasar. The

/**
 * Add feathersClient as Vue.$feathers
 */
import AuthManagement from 'feathers-authentication-management/lib/client'
import { LocalStorage } from 'quasar'
import feathersClient from '../lib/feathersClient' // new Auth API https://crow.docs.feathersjs.com/api/authentication/client.html#authentication-client

export default ({ router, store, Vue }) => {
  console.log(LocalStorage)
  const auth = {
    rememberMe (email) {
      // console.log('Help Me! I create a compile time webpack error: quasar_src_plugins_LocalStorage_js__WEBPACK_IMPORTED_MODULE_1__.default.getItem is not a function')
      if (email) return LocalStorage.set('remember_me', email)
      return LocalStorage.getItem('remember_me') || ''
    },

    currentUser (prop) {
      const u = store.state.auth.user || false
      if (u && prop) return u[prop]
      return u
    },

Codepen/jsFiddle/Codesandbox (required)

Clone this repo and uncomment lines here: https://github.com/quathers/myproject/blob/master/src/boot/feathers.js#L5

To Reproduce

console.log(LocalStorage) creates this in the browser console:

{install: ƒ}
install: ƒ install(_ref)
arguments: (...)
caller: (...)
length: 1
name: "install"
prototype: {constructor: ƒ}
__proto__: ƒ ()
[[FunctionLocation]]: LocalStorage.js?18d6:5
[[Scopes]]: Scopes[3]
__proto__: Object

Expected behavior A clear and concise description of what you expected to happen.

Screenshots If applicable, add screenshots to help explain your problem.

Platform (please complete the following information): OS: Node: NPM: Yarn: Browsers: iOS: Android: Electron:

Additional context Add any other context about the problem here.

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Comments: 17 (10 by maintainers)

Most upvoted comments

@MichaelJCole add ‘LocalStorage’ in your quasar.conf.js plugins array.


      // Quasar plugins
      plugins: [
        'Notify',
        'LocalStorage' // add this :)
      ]

https://quasar.dev/quasar-plugins/web-storage#Installation

That’s my plan 😊

Sent from my iPhone

On 30 Jun 2019, at 08:52, Scott notifications@github.com wrote:

I’d say, if we would have the ability to warn about a missing entry in quasar.conf.js I’d venture to say, we would also have the ability to just add it to the config automatically, right?

Scott

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or mute the thread.

@captainjapeng Found a problem when Local/SessionStorage is not available on client-side… the returned API differed than when it’s available. Fix will be in “quasar” v1.2.2.

From the linked issue: I have the LocalStorage at my plugins: plugins: ['Loading', 'Notify', 'Dialog', 'LocalStorage'],

but still have an TypeError: quasar__WEBPACK_IMPORTED_MODULE_4__.LocalStorage.getItem is not a function error

Also, if I print the LocalStorage object, i got:

{ install: [Function: install],
  has: [Function: t],
  get:
   { length: [Function: t],
     item: [Function: t],
     index: [Function: t],
     all: [Function: t] },
  set: [Function: t],
  remove: [Function: t],
  clear: [Function: t],
  isEmpty: [Function: t] }

I use it with SSR, without it it works fine.