Auth-module: $axios is not available

[NeOMakinG]

Hello guys,

Someone faced this error on nuxt ? I've added the 2 modules to nuxt.config.js and the auth module return me this error with !this.app.$axios...

Thanks for your response..

NeOMakinG

_{This question is available on Nuxt.js community (#c43)}

[fanckush]

Im not sure why this is happening but did you add axios to the modules before auth? like so:

modules: [
'@nuxtjs/axios',
'@nuxtjs/auth'
],

[NeOMakinG]

Yes exactly did like that !

[fanckush]

Thats about all i can help. How about trying a fresh empty nuxt project and install auth immediately after and see if you get a problem, this should narrow down the cause. if it does work maybe then maybe in your current project something is wrong in the nuxt config or code you wrote

Is the error from code you've written or is it internal?

[NeOMakinG]

It's an error from the auth-module, in auth.class, because Axios is probably not loaded in the app, but why...

Trying to install a fresh nuxt install to check, thanks for your help anyway ;)

[NeOMakinG]

Well, tried this on a fresh new app, and It's doing the same thing!

[fanckush]

What do you have in package.json in dependencies:{}:

[NeOMakinG]

"dependencies": { "@nuxtjs/auth": "^4.0.0-rc.3", "@nuxtjs/axios": "^5.0.0", "nuxt": "^1.0.0" }

That's the fresh new app

[fanckush]

ok everything seems fine! Are you using a nuxt template or you are doing it from scratch

In my case i am using the starter template from https://github.com/nuxt-community/starter-template and it works

[NeOMakinG]

Using the starter template on my main app, not working too ^^

[fanckush]

lol ok i don't know anymore, update everything :D npm, vue-cli, node

mayble clone this https://github.com/nuxt-community/auth-module/tree/master/example/with-vanilla-nuxt and use it as your base template.

[zalmane]

For some bizarre reason it seems you have to add axios last (opposite of what it says in doc):

  modules: [
    '@nuxtjs/auth',
    '@nuxtjs/axios'
  ],

[NeOMakinG]

Nice !! But strange 👍

Thanks you, should have test it before posting there lol

[pi0]

Hey. Thanks for reporting. This is super strange. With the latest release, it should automatically insert itself just after axios. source (And also tests are doing the same order. Actually order shouldn't matter)

Would you please share contents of .nuxt/index.js when axios is the first item?

[NeOMakinG]

Hey, No problem !

Here is the index.js file with axios as first :

https://pastebin.com/WyCnJMq5

Looks like axios plugin is imported after Auth one, when Axios is after, in index.js he's imported before auth plugin!

[pi0]

import nuxt_plugin_authplugin_72500e98 from 'nuxt_plugin_authplugin_72500e98' // Source: ./auth\auth.plugin.js

Ah, i got it! Windows backslash problem again! Will resolve it soon.

[NeOMakinG]

Well yeah, sorry for using windob :D

[busheezy]

Thanks for finding the problem. I'm running into this, with the latest published release.

[CoolGoose]

The fix with the order of the imports from @zalmane still works.
I'm on windows 10, with a fresh npm install on

"dependencies": {
    "@nuxtjs/auth": "^4.0.0-rc.3",
    "@nuxtjs/axios": "^5.0.1",
    "@nuxtjs/vuetify": "^0.4.0",
    "axios": "^0.18.0",
    "nuxt": "^1.0.0",
    "vuetify": "^1.0.0"
},

Node: v8.9.3 npm 5.6

[CoolGoose]

Actually, it seems that the module resolution errors out incorrectly. Both orders work for the auth/axios
If i don't have the nuxtjs/vuetify entry in the modules it does error out with the error that axios isn't defined.
Nope, I am stupid, order matters, below image is from when it fails.

[breakingrobot]

Closing as solved by be1bed2.

[g0shed]

I'm still getting the same error on windows

{ Error: $axios is not available at Auth.get $axios [as $axios] (.nuxt/auth/auth.class.js:93:0) at Auth.setToken (.nuxt/auth/auth.class.js:262:0) at Auth.syncToken (.nuxt/auth/auth.class.js:290:0) at Auth.init (.nuxt/auth/auth.class.js:39:0) at module.exports.__webpack_exports__.a (.nuxt/auth/auth.plugin.js:55:0) at createApp (.nuxt/index.js:166:0) at <anonymous> at process._tickCallback (internal/process/next_tick.js:188:7) statusCode: 500, name: 'NuxtServerError' }

[busheezy]

@g0shed What version are you using? I don't think we've had an NPM push in a while. A few bugs are fixed and just waiting for an NPM push.

[knight0202]

``