Q:

VueJS "RangeError: Maximum call stack size exceeded"

Please help me to fix this
router.js
routes: [{
  path: "",
  component: () => import("@/layouts/full-page/FullPage.vue"),
  children: [{
    path: "/pages/login",
    name: "page-login",
    component: () => import("@/views/pages/Login.vue")
  }, {
    path: "/pages/signup",
    name: "page-signup",
    component: () => import("@/views/pages/Signup.vue")
  }, {
    path: "/pages/error-404",
    name: "page-error-404",
    component: () => import("@/views/pages/Error404.vue")
  }]
}, {
  path: "*",
  redirect: "/pages/error-404"
}]

and
router.beforeEach((to, from, next) => {
  if (to.path != "/pages/login") {
    if (auth.isAuthenticated()) {
      next();
    } else {
      if(to.path == "/pages/signup") {
        next("/pages/signup");
      }else{
        next("/pages/login");
      }
    }
  } else {
    next();
  }
});

When I open pages/login the error doesn't happen. But when I open pages/signup, it's always an error.
This is the error in the console:

"RangeError: Maximum call stack size exceeded"

A:

This will cause an infinite loop:
if(to.path == "/pages/signup") {
        next("/pages/signup");

It's redirecting to the same route it's already going to, which causes the beforeEach to run again, and then triggers another redirect on the next iteration.  Change that to:
if(to.path == "/pages/signup") {
        next();

