refactor: 移除旧版 devtools 集成,改用组件化方式

- 移除 TanStack Query 开发工具的集成配置
- 移除对 tanstack-query devtools 的导出
- 移除 TanStack Router 开发工具插件的集成配置
- 移除 tanstack-router 开发工具集成的导出
- 移除旧的 devtools 集成方式,改用新的组件化方式引入 TanStack Router 和 Query 的开发工具面板。
This commit is contained in:
2026-01-21 16:11:46 +08:00
parent d922c2c242
commit e49e8606da
5 changed files with 12 additions and 19 deletions

View File

@@ -1,7 +0,0 @@
import type { TanStackDevtoolsReactPlugin } from '@tanstack/react-devtools'
import { ReactQueryDevtoolsPanel } from '@tanstack/react-query-devtools'
export const devtools = {
name: 'TanStack Query',
render: <ReactQueryDevtoolsPanel />,
} satisfies TanStackDevtoolsReactPlugin

View File

@@ -1 +0,0 @@
export * from './devtools'

View File

@@ -1,7 +0,0 @@
import type { TanStackDevtoolsReactPlugin } from '@tanstack/react-devtools'
import { TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools'
export const devtools = {
name: 'TanStack Router',
render: <TanStackRouterDevtoolsPanel />,
} satisfies TanStackDevtoolsReactPlugin

View File

@@ -1 +0,0 @@
export * from './devtools'

View File

@@ -1,15 +1,15 @@
import { TanStackDevtools } from '@tanstack/react-devtools' import { TanStackDevtools } from '@tanstack/react-devtools'
import type { QueryClient } from '@tanstack/react-query' import type { QueryClient } from '@tanstack/react-query'
import { ReactQueryDevtoolsPanel } from '@tanstack/react-query-devtools'
import { import {
createRootRouteWithContext, createRootRouteWithContext,
HeadContent, HeadContent,
Scripts, Scripts,
} from '@tanstack/react-router' } from '@tanstack/react-router'
import { TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools'
import type { ReactNode } from 'react' import type { ReactNode } from 'react'
import { ErrorComponent } from '@/components/Error' import { ErrorComponent } from '@/components/Error'
import { NotFoundComponent } from '@/components/NotFount' import { NotFoundComponent } from '@/components/NotFount'
import { devtools as queryDevtools } from '@/integrations/tanstack-query'
import { devtools as routerDevtools } from '@/integrations/tanstack-router'
import appCss from '@/styles.css?url' import appCss from '@/styles.css?url'
export interface RouterContext { export interface RouterContext {
@@ -54,7 +54,16 @@ function RootDocument({ children }: Readonly<{ children: ReactNode }>) {
config={{ config={{
position: 'bottom-right', position: 'bottom-right',
}} }}
plugins={[routerDevtools, queryDevtools]} plugins={[
{
name: 'TanStack Router',
render: <TanStackRouterDevtoolsPanel />,
},
{
name: 'TanStack Query',
render: <ReactQueryDevtoolsPanel />,
},
]}
/> />
<Scripts /> <Scripts />
</body> </body>