Recently I came across the issue of using the module in Nuxt.js and invoking a $ in subsequent line of code in the same method. The conundrum began when the lines after the method did not execute as intended since the page was redirected to the redirect URI. auth router.push auth.loginWith It has been only a week in the Vue.js land, so I suppose this issue is something faced by many newbies. So, here goes where it all started: I have a function, whose body looks like: authenticate() { .$auth.loginWith( , { : .user }) .$router.push( .localePath({ : })) } (e) { } try await this 'local' data this // some other line of code that shows loading msgs // ... this this path 'dashboard' catch // handling error Now, notice that once the gets invoked, the execution is handed over to the middleware of nuxt.js. Thus, using a in is redundant. line: 2 auth $router.push line:5 Before we proceed any further, let’s take a look where the auth’s configs are defined: Go to: nuxt.config.js Find the key auth auth: { : { : , : , : , : }, redirect login '/login' logout '/' callback '/login' home Notice, the key. home Bingo! This is exactly where we want to tweak. Before we do any tweaking, let’s make it clear what we are trying to do and : why We want to use all the good things offered by the module, other than the thing. auth redirect The lines after the are necessary to be executed before the view can be updated. In this case it is a loading and success notification that needs to be shown before the user is redirected to the dashboard upon successful login. $auth.loginWith Now, the only thing left to do is disabling the redirect case in option auth will do the job! home: false The object in would look like this now: auth nuxt.config.js auth: { : { : , : , : , : }, redirect login '/login' logout '/' callback '/login' home false Bam! We are done. Previously published at https://medium.com/consol/using-auth-modules-redirect-in-tandem-with-router-push-in-nuxt-js-d6d703e0a85a
