Question 207729 in Reactjs Question posted in
The new location for the React Documentation can be found here.

Reactjs – React router error: Unsafe assignment of an `any` value

This code supposedly works on my previous projects. I wonder why typescript returns this kind of error:

Unsafe assignment of an anyvalue.eslint@typescript-eslint/no-unsafe-assignment Unsafe call of ananytyped value.eslint@typescript-eslint/no-unsafe-call (alias) createBrowserRouter(routes: RouteObject[], opts?: DOMRouterOpts | undefined): Router import createBrowserRouter
react-router-dom version 6.14.1

import MainLayout from '../layouts/MainLayout';
import TodoListPage from '../components/pages/TodoListPage/TodoPage';
 
import ProtectedRoute from './ProtectedRoute';

const MainRoutes = {
  path: '/',
  element: <MainLayout />,
  children: [
    {
      path: '/',
      element: (
        <ProtectedRoute>
          <TodoListPage />
        </ProtectedRoute>
      ),
    }, 
  ],
};

export default MainRoutes;

Error on this part:

const router = createBrowserRouter([MainRoutes, AuthRoutes]);

The typescript error should be fix.

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    Solution: I have fix it by adding src ignorePatterns in .eslintrc

    ignorePatterns: [".eslintrc.cjs", "vite.config.ts", "src"],

  2. 0

    As per your error, it says that it expects routes of the RouteObject[] type. You have to maintain it as you are using typescript.

    the issue is,

    const router = createBrowserRouter([MainRoutes, AuthRoutes]);
// this means that createBrowserRouter([RouteObject[], RouteObject[]]);
// and it expects createBrowserRouter([RouteObject[])
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search