Cordova plugin is always undefined

[Sweetyy]

Hi everyone,

I have a real problem with another Cordova plugin called ‘cordova-plugin-file-transfer’.
Indeed, i always get an error message saying error 'FileTransfer' is not defined.
I checked a long time on differents cordova forums or stackoverflow and they always say the same thing to fix it :

document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
   // as soon as this function is called FileTransfer "should" be defined
   console.log(FileTransfer);
}

Unfortunately i tried to do it in many ways with Quasar in the script section of a vue file but it’s never defined… I really need your help guys please it’s the last step before i can deploy my app…

Here is what i tried :

<script>
document.addEventListener('deviceready', () => {
}, false)
export default {
  data () {
  },
  methods: {
    send () {
      console.log(FileTransfer)
    }
  }
}
</script>

And :

<script>
export default {
  data () {
    return {
    }
  },
  methods: {
    send () {
      document.addEventListener('deviceready', onDeviceReady, false)
      function onDeviceReady () {
        // as soon as this function is called FileTransfer "should" be defined
        console.log(FileTransfer)
      }
    }
  }
}
</script>

Thanks in advance

[Hawkeye64]

I would put this in mounted.

[Sweetyy]

Hi @Hawkeye64 ,

Thanks for your proposition but i tried it and it doesn’t work…

Any other idea please ?

[pd76]

Ok, weirdo. I tried to install the plugin in a “base” quasar project and everything works with no errors. By “base project” I mean: answer no to all the questions at quasar init phase, especially don’t use a linter (I really think this is the point…).

Then I created project2 answering yes to all, and got the same your issue:

/tmp/project2/src/pages/index.vue
  24:18  error  'FileTransfer' is not defined  no-undef

✖ 1 problem (1 error, 0 warnings)

In project2 then I tried to disable the linter… and everything worked as expected (I disable the linter commenting the body of extendWebpack (cfg) in quasar.conf.js, not sure if it’s the right way but the linter was disabled).

index.vue:

<template>                                                                                                                         
  <q-page class="flex flex-center">
    <div>
      {{ foo }}
    </div>
    <img alt="Quasar logo" src="~assets/quasar-logo-full.svg">
  </q-page>
</template>

<style>
</style>

<script>
export default {
  name: 'PageIndex',
  data: function () {
    return {
      foo: ''
    }
  },
  created: function () {
    this.foo = FileTransfer
  }
}
</script>

Well, hope this gives you some help. Let us know.

[Sweetyy]

Thank you so much @pd76 !

You are right ! By disabling the linter in the quasar.conf it works !

You saved me x)