Redirect(return) is not working for login

[melvik]

I cannot implement redirecting to the login page and would appreciate your help.

I used Next() - gives error - didn't work
I used push - didn't work
I used return { } - didn't work
I used return { path: '/login' } - didn't work
I used return { name: '/login' } - didn't work

I have the following directory/file structure for routes:

src/pages/
├── [xyz]/
|     └── index.vue
|     └── [slug].vue
|     └── create.vue
├── [abc]/
|     └── index.vue
|     └── [slug].vue
|     └── create.vue
└── index.vue
└── login.vue
└── join.vue

This is my router\index.ts

import { createRouter, createWebHistory } from 'vue-router/auto'
import { routes } from 'vue-router/auto-routes'
import { useAuthStore } from '@/stores/auth'
import { UserService } from '@/services/user-service'
import Axios from 'axios'

const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes,
})

router.beforeEach(async (to, from) => {
  const authStore = useAuthStore()
  console.log('from', from)
  console.log('to', to)

  if (!(await authStore.isAuth())) {
      console.error('No auth_token!')
      // return { name: '/login' }

      // router.push('/login')

      // return { path: '/login' }/////////////////////// NOT
      // return next({ path: '/login' }) //////////////// NOT
      // await router.push('/login') //////////////////// NOT
      // return {
      //   path: 'login',
      // }
    

  } else {
    console.log('ALREADY LOGGED IN - FOR CHECKING')
  }
})

export default router

[PindaPixel]

Looks to me that your guard is still checking whether the user is authenticated on the login page. A simple early return when from equals /login?

[melvik]

OMG Thanks a million @PindaPixel