Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

📝 Updategenerate-clients.md#13793

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 ourterms of service andprivacy statement. We’ll occasionally send you account related emails.

Already on GitHub?Sign in to your account

Draft
mrlubos wants to merge1 commit intofastapi:master
base:master
Choose a base branch
Loading
frommrlubos:patch-1
Draft
Changes fromall commits
Commits
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Update generate-clients.md
Reference the latest `@hey-api/openapi-ts` release
  • Loading branch information
@mrlubos
mrlubos authoredJun 15, 2025
commit4a9e2e6ffddec9ce42da8c8b7b54aa4bf4268509
24 changes: 12 additions & 12 deletionsdocs/en/docs/advanced/generate-clients.md
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -10,7 +10,7 @@ There are many tools to generate clients from **OpenAPI**.

A common tool is <a href="https://openapi-generator.tech/" class="external-link" target="_blank">OpenAPI Generator</a>.

If you are building a **frontend**,a very interestingalternative is <a href="https://github.com/hey-api/openapi-ts" class="external-link" target="_blank">openapi-ts</a>.
If you are building a **TypeScript client**,another open-sourcealternative is <a href="https://github.com/hey-api/openapi-ts" class="external-link" target="_blank">@hey-api/openapi-ts</a>.

## Client and SDK Generators - Sponsor

Expand All@@ -23,7 +23,7 @@ And it shows their true commitment to FastAPI and its **community** (you), as th
For example, you might want to try:

* <a href="https://speakeasy.com/?utm_source=fastapi+repo&utm_medium=github+sponsorship" class="external-link" target="_blank">Speakeasy</a>
* <a href="https://www.stainlessapi.com/?utm_source=fastapi&utm_medium=referral" class="external-link" target="_blank">Stainless</a>
* <a href="https://www.stainless.com/?utm_source=fastapi&utm_medium=referral" class="external-link" target="_blank">Stainless</a>
* <a href="https://developers.liblab.com/tutorials/sdk-for-fastapi?utm_source=fastapi" class="external-link" target="_blank">liblab</a>

There are also several other companies offering similar services that you can search and find online. 🤓
Expand All@@ -50,11 +50,11 @@ And that same information from the models that is included in OpenAPI is what ca

### Generate a TypeScript Client

Now that we have the app with the models, we can generatethe client code for the frontend.
Now that we have the app with the models, we can generatea TypeScript client.

#### Install `openapi-ts`
#### Install `@hey-api/openapi-ts`

You can install `openapi-ts` in yourfrontend code with:
You can install `@hey-api/openapi-ts` in yourTypeScript project with:

<div class="termy">

Expand All@@ -81,31 +81,31 @@ It could look like this:
"description": "",
"main": "index.js",
"scripts": {
"generate-client": "openapi-ts --input http://localhost:8000/openapi.json --output ./src/client --client axios"
"generate-client": "openapi-ts -i http://localhost:8000/openapi.json -o ./src/client"
},
"author": "",
"license": "",
"devDependencies": {
"@hey-api/openapi-ts": "^0.27.38",
"typescript": "^4.6.2"
"@hey-api/openapi-ts": "^0.73.0",
"typescript": "^5.8.3"
}
}
```

After having thatNPM `generate-client` script there, you can run it with:
After having thatnpm `generate-client` script there, you can run it with:

<div class="termy">

```console
$ npm run generate-client

frontend-app@1.0.0 generate-client /home/user/code/frontend-app
> openapi-ts --input http://localhost:8000/openapi.json --output ./src/client --client axios
> openapi-ts -i http://localhost:8000/openapi.json -o ./src/client
```

</div>

That command will generate code in `./src/client` and will use`axios` (the frontend HTTP library) internally.
That command will generate code in `./src/client` and will use[`Fetch API`](https://developer.mozilla.org/docs/Web/API/Fetch_API) internally.

### Try Out the Client Code

Expand DownExpand Up@@ -229,7 +229,7 @@ Now as the end result is in a file `openapi.json`, you would modify the `package
"description": "",
"main": "index.js",
"scripts": {
"generate-client": "openapi-ts --input ./openapi.json --output ./src/client --client axios"
"generate-client": "openapi-ts -i ./openapi.json -o ./src/client"
},
"author": "",
"license": "",
Expand Down
[8]ページ先頭
©2009-2025 Movatter.jp