Axios interceptors based on version

[grantholle]

In my brand new Laravel project (using Vite, which may be relevant), I had [email protected] installed. However, my interceptors with Inertia requests weren't working until I matched the versions (0.21).

Perhaps a dumb question, but should that matter?

axios.interceptors.response.use(response => {
  console.log('intercepted')
})

Using that snippet, each changing of page and request will log correctly when I install [email protected]. However when I install axios@latest, the interceptor no longer intercepts and I get no logging. I can't tell where the problem is/whose fault it is.

[citricguy]

I'm running into the same issue at the moment. I'm hoping to be able to continue to use version 0.27 for my manual calls, and then tap into 0.21 with interceptors for Inertia specific calls (as that's the version it currently ships with).

Currently, running the same version of Axios (0.21) as Inertia is the only way I can get this to work.

I believe Axios is going away in Inertia though. I really hope whatever replaces it has something like interceptors as well as I rely on them quite a bit.

[grantholle]

Yeah they are critical to the apps that I build. Axis so ubiquitous that I hope it stays, since whatever it's replaced with will need to allow manual calls as well. Why reinvent the wheel?

[Tofandel]

It's because with multiple version your bundler will include two different versions of axios on the same page, each are completely different instances and why interceptors don't work

If using webpack add

  resolve: {
    alias: {
    //...
      axios: path.resolve('node_modules/axios/dist/axios.js'),
    },
  },

And then you can use whatever version you like, only one will be bundled

[citricguy]

Thank you for this. This will make updates a bit more reliable for me now as I don't have to manually sync packages.

[grantholle]

I'm using Vite. I believe it has a similar alias system and I'll give it a try.

Thanks!

[citricguy]

@grantholle Did you by chance discover how to do this using Vite?

[Tofandel]

It's exactly the same in vite
https://vueschool.io/articles/vuejs-tutorials/import-aliases-in-vite/

[citricguy]

@Tofandel Thank you!