creada estructura de directorios

{

  "compilerOptions": {

    "baseUrl": ".",

    "target": "es6",

    "paths": {

      "@/*": ["./src/*"]

    }

  }

}

import React, { useEffect, useState } from "react";

import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom';

import {PaginaHead} from "./common/PaginaHead";

import {Autenticador} from "./users/Autenticador";

import {LoginRequiredRoutes} from "./common/LoginRequiredRoutes"

import {PaginaHead} from "@/common/PaginaHead";

import {Autenticador} from "@/components/common/utility/Autenticador";

import {LoginRequiredRoutes} from "@/common/LoginRequiredRoutes"

import "./App.css";

import {LoginPage} from "./users/loginPage";

import {InicioTest} from './users/InicioTest';

import {LoginPage} from "./components/users/LoginPage/LoginPage";

import {InicioTest} from './components/users/InicioTest';

function App() {

  return (    

      <Autenticador>

        <Routes>

          {/* Rutas publicas */}

          <Route path="/" element={<Navigate to="/login" />} />

          <Route path="/login" element={<LoginPage/>} />

          {/* Rutas protegidas */}

          <Route element={<LoginRequiredRoutes />}>

            <Route path="/inicioTest" element={<InicioTest />} />

          </Route>

        </Routes>

      </Autenticador>

import { useAutenticacion } from "@/users/Autenticador";

import { useAutenticacion } from "@/components/common/utility/Autenticador";

import { Navigate, Outlet } from "react-router-dom";

export const LoginRequiredRoutes = () => {