Vigia

Nâng cấp @graphiql/react từ 0.x lên 1.x

So sánh API công khai của @graphiql/react 0.39.1 và 1.0.0, được tính tự động từ kiểu TypeScript. Chữ ký thay đổi là thay đổi có thể không tương thích, không phải điều chắc chắn.

Tóm tắt

Đường dẫn import bị xóa0
Export bị xóa15
Chữ ký thay đổi3
Thành viên lớp hoặc interface bị xóa2
Thành viên lớp hoặc interface thay đổi1
Mới bị ngừng hỗ trợ1
Thay đổi yêu cầu (engines, phụ thuộc peer)1
Export mới45

Export bị xóa

importexportkindTrước
@graphiql/reactcnvariableany
@graphiql/reactuseThemefunction(): { setTheme: (newTheme: Theme) => void; theme: Theme; }
@graphiql/reactuseStoragevariable(): any
@graphiql/reactuseCopyQueryfunction(): () => Promise<void>
@graphiql/reactuseMergeQueryfunction(): () => void
@graphiql/reactuseEditorStorevariable(): { externalFragments: Map<string, any>; shouldPersistHeaders: boolean; initialQuery: string; initialVariables: string; initialHeaders: string; headerEditor?: any; queryEditor?: any; responseEditor?: any; variableEditor?: any; addTab: () => void; changeTab: (index: number) => void; moveTab: (newOrder: TabState[]) => void; closeTab: (index: number) => void; updateActiveTabValues: (partialTab: Partial<Omit<TabState, "id" | "hash" | "title">>) => void; setHeaderEditor: (headerEditor: monaco.editor.IStandaloneCodeEditor) => void; setQueryEditor: (queryEditor: monaco.editor.IStandaloneCodeEditor)…
@graphiql/reactusePluginStorevariable(): { plugins: GraphiQLPlugin[]; visiblePlugin: GraphiQLPlugin | null; setVisiblePlugin: (plugin?: string | GraphiQLPlugin | null | undefined) => void; }
@graphiql/reactuseSchemaStorevariable(): { isFetching: boolean; fetchError: string | null; schema: any; validationErrors: readonly any[]; introspect: () => Promise<void>; }
@graphiql/reactuseEditorContextfunction(): { externalFragments: Map<string, any>; shouldPersistHeaders: boolean; initialQuery: string; initialVariables: string; initialHeaders: string; headerEditor?: any; queryEditor?: any; responseEditor?: any; variableEditor?: any; addTab: () => void; changeTab: (index: number) => void; moveTab: (newOrder: TabState[]) => void; closeTab: (index: number) => void; updateActiveTabValues: (partialTab: Partial<Omit<TabState, "id" | "hash" | "title">>) => void; setHeaderEditor: (headerEditor: monaco.editor.IStandaloneCodeEditor) => void; setQueryEditor: (queryEditor: monaco.editor.IStandaloneCodeEditor)…
@graphiql/reactusePluginContextfunction(): { plugins: GraphiQLPlugin[]; visiblePlugin: GraphiQLPlugin | null; setVisiblePlugin: (plugin?: string | GraphiQLPlugin | null | undefined) => void; }
@graphiql/reactuseSchemaContextfunction(): { isFetching: boolean; fetchError: string | null; schema: any; validationErrors: readonly any[]; introspect: () => Promise<void>; }
@graphiql/reactuseExecutionStorevariable(): { isFetching: boolean; isSubscribed: boolean; operationName: string | undefined; run: () => void; stop: () => void; }
@graphiql/reactuseStorageContextvariable(): any
@graphiql/reactusePrettifyEditorsfunction(): () => Promise<void>
@graphiql/reactuseExecutionContextfunction(): { isFetching: boolean; isSubscribed: boolean; operationName: string | undefined; run: () => void; stop: () => void; }

Chữ ký thay đổi

exportTrướcSau
@graphiql/react · Theme"light" | "dark" | null"dark" | "light" | null
@graphiql/react · KEY_MAPReadonly<{ prettify: { key: string; keybindings: number[]; }; mergeFragments: { key: string; keybindings: number[]; }; runQuery: { key: string; keybindings: number[]; }; autoComplete: { key: string; }; copyQuery: { key: string; keybindings: number[]; }; refetchSchema: { key: string; }; searchInEditor: { key: string; }; searchInDocs: { key: string; }; }>Readonly<{ prettify: { key: string; keybindings: number[]; }; mergeFragments: { key: string; keybindings: number[]; }; runQuery: { key: string; keybindings: number[]; }; autoComplete: { key: string; }; copyQuery: { key: string; keybindings: number[]; }; saveQuery: { key: string; keybindings: number[]; }; refetchSchema: { key: string; }; searchInEditor: { key: string; }; searchInDocs: { key: string; }; }>
@graphiql/react · debounce<F extends (...args: any[]) => any>(duration: number, fn: F): F<F extends (...args: any[]) => any>(duration: number, fn: F): DebouncedFn<F>

Thành viên lớp hoặc interface bị xóa

memberimportTrước
SlicesWithActions.monacoTheme@graphiql/reactany
SlicesWithActions.overrideOperationName@graphiql/reactstring | null

Thành viên lớp hoặc interface thay đổi

memberTrướcSau
SlicesWithActions.fetcherFetcherany

Mới bị ngừng hỗ trợ

export@deprecated
@graphiql/react · SlicesWithActions.fetcherPass a `transport` instead. The `Fetcher` contract cannot surface HTTP wire metadata (status, headers, timing, size). See `docs/migration/graphiql-6.0.0.md`.

Thay đổi yêu cầu (engines, phụ thuộc peer)

TrướcSau
peerDependencies.graphql^15.5.0 || ^16.0.0 || ^17.0.0^16.11.0 || ^17.0.0
Export mới (45)
importexportkind
@graphiql/reactTopBarvariable
@graphiql/reactDensitytype
@graphiql/reactFontSizetype
@graphiql/reactMODIFIERvariable
@graphiql/reactSaveIconvariable
@graphiql/reactCleanupFntype
@graphiql/reactOperationvariable
@graphiql/reactSidePanelvariable
@graphiql/reactStatusBarvariable
@graphiql/reactKeycapHintvariable
@graphiql/reactMethodPillvariable
@graphiql/reactModifierKeytype
@graphiql/reactPanelHeadervariable
@graphiql/reactSaveHandlertype
@graphiql/reactTopBarPropstype
@graphiql/reactActivityRailvariable
@graphiql/reactResponseViewtype
@graphiql/reacttypeCategoryfunction
@graphiql/reactSettingsThemetype
@graphiql/reactVarHeadersTabtype
@graphiql/reactPortalProvidervariable
@graphiql/reactSettingsDialogvariable
@graphiql/reactGraphQLLogoIconvariable
@graphiql/reactKeycapHintPropstype
@graphiql/reactMethodPillPropstype
@graphiql/reactVarHeadersStripvariable
@graphiql/reactConnectionStatustype
@graphiql/reactGraphiQLSettingstype
@graphiql/reactPanelHeaderPropstype
@graphiql/reactQueryBuilderIconvariable
@graphiql/reactSegmentedControlfunction
@graphiql/reactActivityRailPropsinterface
@graphiql/reactOnResponseCallbacktype
@graphiql/reactusePortalContainerfunction
@graphiql/reactGraphQLTypeCategorytype
@graphiql/reactSettingsDialogPropsinterface
@graphiql/reactuseGraphiQLSettingsfunction
@graphiql/reactOnBeforeSendCallbacktype
@graphiql/reactSETTINGS_STORAGE_KEYvariable
@graphiql/reactVarHeadersStripPropstype
@graphiql/reactGraphiQLPluginContexttype
@graphiql/reactSegmentedControlPropstype
@graphiql/reactPluginTransportContexttype
@graphiql/reactSegmentedControlOptiontype
@graphiql/reactuseGraphiQLPluginContextfunction

Cung cấp dữ liệu này cho tác tử AI của bạn

Vigia là máy chủ MCP miễn phí: tác tử lập trình của bạn kiểm tra phiên bản, thay đổi phá vỡ tương thích và lỗ hổng trước khi viết mã. Không cần đăng ký, không cần khóa API.

claude mcp add --transport http vigia https://vigia.coredls.cloud/mcp

Thêm vào CursorThêm vào VS Code★ Gắn sao trên GitHub

Mọi ứng dụng MCP khác
{ "mcpServers": { "vigia": { "url": "https://vigia.coredls.cloud/mcp" } } }

Kỹ năng cho tác tử (SKILL.md): cho tác tử biết khi nào dùng Vigia · GitHub Action cho pull request

Câu hỏi thường gặp

Nâng cấp @graphiql/react từ 0 lên 1 có những thay đổi không tương thích nào?

Giữa @graphiql/react 0.39.1 và 1.0.0, Vigia tìm thấy 15 export bị xóa, 3 chữ ký thay đổi và 3 thành viên lớp hoặc interface bị xóa hay thay đổi.

Những gì bị ngừng hỗ trợ trong @graphiql/react 1?

1 export hoặc thành viên mới bị đánh dấu ngừng hỗ trợ trong @graphiql/react 1.0.0.

Dành cho tác tử

GET https://vigia.coredls.cloud/v1/packages/npm/@graphiql/react/upgrade?from=0.39.1&to=1.0.0