🐛 fix(custom): 修复sentry无法捕获到路由的错误

src/main.tsx

@@ -1,5 +1,12 @@
 import ReactDOM from "react-dom/client";
-import { createBrowserRouter, RouterProvider } from "react-router-dom";
+import {
+  createBrowserRouter,
+  createRoutesFromChildren,
+  matchRoutes,
+  RouterProvider,
+  useLocation,
+  useNavigationType,
+} from "react-router-dom";
 //router page
 import VideoPage from "./routers/video";
 import Layout from "./routers/layout";
@@ -23,6 +30,7 @@ import * as Sentry from "@sentry/react";
 import { BrowserTracing } from "@sentry/tracing";
 import SearchPage, { loader as SearchLoader } from "@routers/search";
 import { RecoilRoot } from "recoil";
+import React from "react";
 if (!isdev && isrelease) {
   Sentry.init({
     dsn: "https://086f27258cce4d28aacc8c2719a683fb@sentry.vtb.link/3",
@@ -33,7 +41,15 @@ if (!isdev && isrelease) {
       return event;
     },
     integrations: [
-      new BrowserTracing(),
+      new BrowserTracing({
+        routingInstrumentation: Sentry.reactRouterV6Instrumentation(
+          React.useEffect,
+          useLocation,
+          useNavigationType,
+          createRoutesFromChildren,
+          matchRoutes
+        ),
+      }),
       new Sentry.Replay({
         // Additional SDK configuration goes in here, for example:
         maskAllText: true,
@@ -44,13 +60,15 @@ if (!isdev && isrelease) {
     // Set tracesSampleRate to 1.0 to capture 100%
     // of transactions for performance monitoring.
     // We recommend adjusting this value in production
-    tracesSampleRate: 0.5,
+    tracesSampleRate: 1.0,
     replaysSessionSampleRate: 0.1,
     replaysOnErrorSampleRate: 1.0,
   });
 }
+const sentryCreateBrowserRouter =
+  Sentry.wrapCreateBrowserRouter(createBrowserRouter);
 
-const router = createBrowserRouter([
+const router = sentryCreateBrowserRouter([
   {
     path: "/",
     element: <Layout />,