-
Notifications
You must be signed in to change notification settings - Fork 52
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
docs(suspensive.org): add docs for cli #1032
Merged
Merged
Changes from 4 commits
Commits
Show all changes
5 commits
Select commit
Hold shift + click to select a range
b3a8283
docs(react-query): add docs for cli
gwansikk a88949b
Merge branch 'main' into docs/feature/how-to-use-cli
manudeli 3f5339f
Merge branch 'main' into docs/feature/how-to-use-cli
manudeli 129dcc0
docs(suspensive.org): update docs for cli
gwansikk 86ec195
docs(suspensive.org): update docs for cli
gwansikk File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
131 changes: 131 additions & 0 deletions
131
...sive.org/src/pages/docs/react-query/support-both-tanstack-query-v4-and-5.en.mdx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,131 @@ | ||
import { Callout } from '@/components' | ||
|
||
# Support both TanStack Query v4 and 5 | ||
|
||
As of version 2.2.0, @suspensive/react-query supports both versions 4 and 5 of @tanstack/react-query. | ||
|
||
Internally, it consists of @suspensive/react-query-4 and @suspensive/react-query-5, which correspond to the respective versions of @tanstack/react-query. (In this document, these version-specific packages are referred to as "module") The CLI automatically detects the installed version of @tanstack/react-query in your environment and uses the compatible module. | ||
|
||
## Command-Line Interface (CLI) | ||
|
||
The Command-Line Interface (CLI) of @suspensive/react-query is a tool designed to address compatibility issues with @tanstack/react-query. Using commands, you can verify compatibility with @tanstack/react-query and switch to a compatible version of @suspensive/react-query. | ||
|
||
If a compatibility issue with @tanstack/react-query causes an error, the CLI can be used to resolve the issue. However, it is rare to need to use the CLI, as @suspensive/react-query will automatically use the correct version upon installation. | ||
|
||
<Callout type="info">The CLI is still an experimental feature and may not function as intended.</Callout> | ||
|
||
## Getting Started | ||
|
||
The CLI is included in the @suspensive/react-query package. No additional installation is required, and you can use it directly with the following command. | ||
|
||
```bash | ||
npx suspensive-react-query | ||
``` | ||
|
||
Or simply use the short command `srq`. | ||
|
||
```bash | ||
npx srq | ||
``` | ||
|
||
## Commands | ||
|
||
The CLI currently offers a total of five commands, each described below. | ||
|
||
| Command | Description | | ||
| ------- | -------------------------------------------------------------------------------------------------- | | ||
| version | Displays the currently installed version of @suspensive/react-query. | | ||
| help | Provides usage instructions for the commands in the console. | | ||
| status | Checks the compatibility status with the current @tanstack/react-query version. | | ||
| switch | Changes the module of @suspensive/react-query to a specified version. | | ||
| fix | Automatically changes to the @suspensive/react-query module compatible with @tanstack/react-query. | | ||
|
||
### version | ||
|
||
Displays the currently installed version of @suspensive/react-query. This refers to the package version as specified in `package.json` and does not indicate the internal versions of @suspensive/react-query-4 or @suspensive/react-query-5 used for compatibility with @tanstack/react-query. | ||
|
||
```bash | ||
npx suspensive-react-query -v | ||
``` | ||
|
||
Or | ||
|
||
```bash | ||
npx suspensive-react-query --version | ||
``` | ||
|
||
### help | ||
|
||
Provides usage instructions for the commands in the console. For example, to learn more about the `fix` command, use. | ||
|
||
```bash | ||
npx suspensive-react-query fix -h | ||
``` | ||
|
||
Or | ||
|
||
```bash | ||
npx suspensive-react-query --help | ||
``` | ||
|
||
### status | ||
|
||
Checks the module of @suspensive/react-query currently being used in conjunction with @tanstack/react-query and verifies compatibility. It also displays the available APIs for the detected version. | ||
|
||
```bash | ||
npx suspensive-react-query status | ||
``` | ||
|
||
For example, if using @suspensive/[email protected] and @tanstack/[email protected], you would see. | ||
|
||
``` | ||
Suspensive React Query status: | ||
@suspensive/[email protected] exports @suspensive/react-query-5's interfaces | ||
|
||
- SuspenseQuery | ||
- SuspenseQueries | ||
- SuspenseInfiniteQuery | ||
- QueryErrorBoundary | ||
|
||
@tanstack/[email protected] | ||
|
||
The versions are compatible. | ||
``` | ||
|
||
### switch | ||
|
||
Changes the @suspensive/react-query module to match the specified version of @tanstack/react-query. For instance, if using @tanstack/react-query v5 and encountering an error, you can switch to the compatible module with. | ||
|
||
```bash | ||
npx suspensive-react-query switch 5 | ||
``` | ||
|
||
### fix | ||
|
||
The `fix` command offers a simple way to align versions. It detects the version of @tanstack/react-query in your environment and automatically changes to the corresponding @suspensive/react-query module. | ||
|
||
```bash | ||
npx suspensive-react-query fix | ||
``` | ||
|
||
## Troubleshooting | ||
|
||
If you encounter version-related errors during the build process, you can specify the version to use in `package.json` as follows. To ensure the correct version is used during build, you can add the following script. | ||
|
||
```json | ||
{ | ||
"scripts": { | ||
"build": "suspensive-react-query fix && next build" | ||
} | ||
} | ||
``` | ||
|
||
Alternatively, to lock in a specific version, you can set the script like this. | ||
|
||
```json | ||
{ | ||
"scripts": { | ||
"build": "suspensive-react-query switch 5 && next build" | ||
} | ||
} | ||
``` |
132 changes: 132 additions & 0 deletions
132
...sive.org/src/pages/docs/react-query/support-both-tanstack-query-v4-and-5.ko.mdx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,132 @@ | ||
import { Callout } from '@/components' | ||
|
||
# TanStack Query v4, 5를 모두 지원 | ||
|
||
@suspensive/react-query는 v2.2.0 버전 이후로 @tanstack/react-query의 v4와 v5를 모두 지원합니다. | ||
|
||
내부적으로 @tanstack/react-query 버전에 대응하는 @suspensive/react-query-4와 @suspensive/react-query-5로 구성되어 있습니다. (대응되는 버전 패키지를 해당 문서에서는 "모듈"이라고 부르겠습니다.) 사용자 환경에 설치된 @tanstack/react-query 버전을 감지하여 자동으로 호환되는 모듈을 사용합니다. | ||
|
||
## Command-Line Interface (CLI) | ||
|
||
@suspensive/react-query의 Command-Line Interface (CLI)는 @tanstack/react-query와의 호환성 문제를 해결하기 위한 도구입니다. 명령어를 통해 @tanstack/react-query와의 호환 여부를 확인하고, @suspensive/react-query의 호환되는 버전으로 변경할 수 있습니다. | ||
|
||
특수한 이유로 @tanstack/react-query와 호환되지 않아 에러가 발생하면, CLI를 통해 문제를 해결할 수 있습니다. 하지만 실제로 CLI를 사용할 일은 드물며, @suspensive/react-query 설치 시 자동으로 알맞은 버전을 사용합니다. | ||
|
||
<Callout type="info">CLI는 아직 실험적인 기능이며, 의도대로 동작하지 않을 수 있습니다.</Callout> | ||
|
||
## 시작하기 | ||
|
||
CLI는 @suspensive/react-query 패키지에 포함되어 있습니다. 추가적인 설치는 필요 없으며, 아래 명령어를 통해 바로 사용할 수 있습니다. | ||
|
||
```bash | ||
npx suspensive-react-query | ||
``` | ||
|
||
또는 간단히 `srq`로도 사용할 수 있습니다. | ||
|
||
```bash | ||
npx srq | ||
``` | ||
|
||
## 명령어 | ||
|
||
현재 CLI가 제공하는 명령어는 총 5개로, 각 명령어의 설명은 다음과 같습니다. | ||
|
||
| 명령어 | 설명 | | ||
| ------- | -------------------------------------------------------------------------------- | | ||
| version | 현재 설치된 @suspensive/react-query의 버전을 표시합니다. | | ||
| help | 명령어의 사용 방법을 콘솔에서 확인할 수 있습니다. | | ||
| status | 현재 사용 중인 @tanstack/react-query와의 호환성 여부를 확인합니다. | | ||
| switch | @suspensive/react-query의 모듈을 지정한 버전의 모듈로 변경합니다. | | ||
| fix | @tanstack/react-query와 호환되는 @suspensive/react-query 모듈로 자동 변경합니다. | | ||
|
||
### version | ||
|
||
현재 설치된 @suspensive/react-query의 버전을 표시합니다. 이는 패키지의 버전으로 `package.json`에 명시된 버전을 표시하며, @tanstack/react-query와 호환되도록 내부적으로 구성하는 @suspensive/react-query-4 또는 @suspensive/react-query-5의 버전을 의미하지는 않습니다. | ||
|
||
```bash | ||
npx suspensive-react-query -v | ||
``` | ||
|
||
또는 | ||
|
||
```bash | ||
npx suspensive-react-query --version | ||
``` | ||
|
||
### help | ||
|
||
명령어의 사용 방법을 콘솔에서 확인할 수 있습니다. 예를 들어 `fix` 명령어에 대해 자세히 알고 싶다면, 다음과 같이 명령어를 사용하여 확인할 수 있습니다. | ||
|
||
```bash | ||
npx suspensive-react-query fix -h | ||
``` | ||
|
||
또는 | ||
|
||
```bash | ||
npx suspensive-react-query --help | ||
``` | ||
|
||
### status | ||
|
||
현재 사용 중인 @tanstack/react-query와 대응되고 있는 @suspensive/react-query의 모듈을 확인하고, 호환성 여부를 확인할 수 있습니다. 또한 버전에 따라 사용 가능한 API를 확인할 수 있습니다. | ||
|
||
```bash | ||
npx suspensive-react-query status | ||
``` | ||
|
||
예를 들어, @suspensive/[email protected] 버전과 @tanstack/[email protected] 버전을 사용 중인 경우, 다음과 같은 결과를 확인할 수 있습니다. | ||
|
||
``` | ||
Suspensive React Query status: | ||
@suspensive/[email protected] exports @suspensive/react-query-5's interfaces | ||
|
||
- SuspenseQuery | ||
- SuspenseQueries | ||
- SuspenseInfiniteQuery | ||
- QueryErrorBoundary | ||
|
||
@tanstack/[email protected] | ||
|
||
The versions are compatible. | ||
``` | ||
|
||
### switch | ||
|
||
@tanstack/react-query에 대응하고 있는 @suspensive/react-query 모듈을 변경할 수 있습니다. 예를 들어, @tanstack/react-query v5를 사용하고 있는데 오류가 발생하면, 다음 명령어를 사용하여 호환되는 모듈로 변경할 수 있습니다. | ||
|
||
```bash | ||
npx suspensive-react-query switch 5 | ||
``` | ||
|
||
### fix | ||
|
||
`fix` 명령어는 손쉽게 버전을 맞추는 간편한 방법입니다. 사용자 환경에서 @tanstack/react-query 버전을 감지하여, @suspensive/react-query의 모듈을 자동으로 변경합니다. | ||
|
||
```bash | ||
npx suspensive-react-query fix | ||
``` | ||
|
||
## 문제 해결 | ||
|
||
빌드 도중 버전에 대한 오류가 발생하면, 다음과 같은 방법으로 `package.json`에 사용하고자 하는 버전을 지정할 수 있습니다. | ||
빌드 시 자동으로 올바른 버전을 사용하게 하려면 다음과 같이 스크립트를 사용할 수 있습니다. | ||
|
||
```json | ||
{ | ||
"scripts": { | ||
"build": "suspensive-react-query fix && next build" | ||
} | ||
} | ||
``` | ||
|
||
또는 버전을 고정하려면 다음과 같이 설정할 수 있습니다. | ||
|
||
```json | ||
{ | ||
"scripts": { | ||
"build": "suspensive-react-query switch 5 && next build" | ||
} | ||
} | ||
``` |
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There may be a time in the future to support v6, so I hope it is an expandable path name.
I think it's a good idea for links not to change frequently
For example, when adding this link to a user's blog, I would like to prevent the user from being unable to enter if the link changes.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Oh, I hadn't thought of that. Thank you!