[Navigate] is not a <Route> component. All component children of <Routes> must be a <
 

скрипт выдает ошибку [Navigate] is not a <Route> component. All component children of <Routes> must be a <Route> or <React.Fragment>

import React, {useContext} from 'react';
import {Routes, Route, Navigate} from 'react-router-dom'
import {authRoutes, publicRoutes} from "../routes";
import {SHOP_ROUTE} from "../utils/consts";
import {Context} from "../index";
import {observer} from "mobx-react-lite";

const AppRouter = observer(() => {
    const {user} = useContext(Context)

    console.log(user)
    return (
        <Routes>
            {user.isAuth && authRoutes.map(({path, Component}) =>
                <Route key={path} path={path} component={Component} exact/>
            )}
            {publicRoutes.map(({path, Component}) =>
                <Route key={path} path={path} component={Component} exact/>
            )}
            <Navigate to={SHOP_ROUTE}/>
        </Routes>
    );
});

export default AppRouter;

специально для Aetae!!!

[Navigate] не является компонентом <Route>. Все дочерние компоненты <Routes> должны быть <Route> или <React.Фрагмент>

Вы не понимаете в чем у вас ошибка и как её исправить?

Вы затолкали компонент Navigate в прямые потомки компонента Routes, из-за чего последний пишет вам, что его прямые потомки могут быть только компонентом Route или React.Fragment.

Если нужна максимально топорная инструкция, то удалите строчку 20 и ошибка пропадет.

как сделать так чтобы если в адресной строке нет ни одного роута то иди в шоп

riaron86, чтоб значит "специаьно для меня", лол? Я то читать умею в отличие от тебя. В данном случае описание ошибки ещё более очевидное чем в прошлый раз...

Первый ответ гугла по запросу "react router default route":

<Route exact path="/">
    <Redirect to="/home" />
</Route>