swagger-fsd-gen 1.0.0 → 1.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +52 -156
- package/package.json +2 -1
- package/scripts/generate-all.js +2 -11
- package/swagger-fsd-gen-1.0.0.tgz +0 -0
package/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
#
|
|
1
|
+
# swagger-fsd-gen
|
|
2
2
|
|
|
3
|
-
**ky + TanStack Query + FSD
|
|
3
|
+
Swagger/OpenAPI 문서를 기반으로 **ky + TanStack Query + FSD(Feature-Sliced Design) 패턴**에 맞는 API 클라이언트를 자동으로 생성하는 도구입니다.
|
|
4
4
|
|
|
5
5
|
## ✨ 주요 기능
|
|
6
6
|
|
|
@@ -9,70 +9,62 @@
|
|
|
9
9
|
- 📁 **FSD(Feature-Sliced Design)** 패턴 자동 적용
|
|
10
10
|
- 🔐 **HTTP Basic Authentication** 지원
|
|
11
11
|
- 📝 **TypeScript** 완전 지원 (타입 안전성)
|
|
12
|
-
- 🎨
|
|
12
|
+
- 🎨 **프로젝트의 Prettier 설정** 자동 적용
|
|
13
13
|
|
|
14
|
-
## 📦 설치
|
|
15
|
-
|
|
16
|
-
### 1. 저장소 클론
|
|
14
|
+
## 📦 설치
|
|
17
15
|
|
|
18
16
|
```bash
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
```
|
|
22
|
-
|
|
23
|
-
### 2. 의존성 설치
|
|
17
|
+
# npm
|
|
18
|
+
npm install -D swagger-fsd-gen
|
|
24
19
|
|
|
25
|
-
|
|
26
|
-
yarn
|
|
27
|
-
```
|
|
28
|
-
|
|
29
|
-
### 3. 전역 설치 (선택사항)
|
|
30
|
-
|
|
31
|
-
```bash
|
|
32
|
-
yarn link
|
|
20
|
+
# yarn
|
|
21
|
+
yarn add -D swagger-fsd-gen
|
|
33
22
|
```
|
|
34
23
|
|
|
35
24
|
## 🚀 사용 방법
|
|
36
25
|
|
|
37
|
-
### 1.
|
|
26
|
+
### 1. 직접 실행
|
|
38
27
|
|
|
39
28
|
```bash
|
|
40
|
-
#
|
|
41
|
-
fetch-swagger --url https://api.example.com/swagger.json
|
|
29
|
+
# npm
|
|
30
|
+
npx fetch-swagger --url https://api.example.com/swagger.json --username your-username --password your-password
|
|
31
|
+
npx generate-all --uri https://api.example.com/swagger.json --username your-username --password your-password
|
|
42
32
|
|
|
43
|
-
#
|
|
44
|
-
fetch-swagger --url https://api.example.com/swagger.json --username
|
|
33
|
+
# yarn
|
|
34
|
+
yarn fetch-swagger --url https://api.example.com/swagger.json --username your-username --password your-password
|
|
35
|
+
yarn generate-all --uri https://api.example.com/swagger.json --username your-username --password your-password
|
|
45
36
|
```
|
|
46
37
|
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
### 2. API 클라이언트 생성
|
|
38
|
+
### 2. package.json에 스크립트 추가 (권장)
|
|
50
39
|
|
|
51
|
-
```
|
|
52
|
-
|
|
53
|
-
|
|
40
|
+
```json
|
|
41
|
+
{
|
|
42
|
+
"scripts": {
|
|
43
|
+
"fetch-swagger": "fetch-swagger --url https://api.example.com/swagger.json --username your-username --password your-password",
|
|
44
|
+
"generate-all": "generate-all --uri https://api.example.com/swagger.json --username your-username --password your-password"
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
```
|
|
54
48
|
|
|
55
|
-
|
|
56
|
-
generate-all --uri ./swagger/my-api.yml
|
|
49
|
+
그리고 실행:
|
|
57
50
|
|
|
58
|
-
|
|
59
|
-
|
|
51
|
+
```bash
|
|
52
|
+
# npm
|
|
53
|
+
npm run fetch-swagger
|
|
54
|
+
npm run generate-all
|
|
60
55
|
|
|
61
|
-
#
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
--api-output-path ./src/entities/{moduleName}/api/index.ts \
|
|
65
|
-
--query-output-path ./src/entities/{moduleName}/api/queries.ts \
|
|
66
|
-
--mutation-output-path ./src/entities/{moduleName}/api/mutations.ts
|
|
56
|
+
# yarn
|
|
57
|
+
yarn fetch-swagger
|
|
58
|
+
yarn generate-all
|
|
67
59
|
```
|
|
68
60
|
|
|
69
|
-
## 📁 생성되는 파일 구조
|
|
61
|
+
## 📁 생성되는 파일 구조
|
|
70
62
|
|
|
71
63
|
```
|
|
72
64
|
src/
|
|
73
65
|
├── shared/
|
|
74
66
|
│ └── api/
|
|
75
|
-
│ └── dto.ts #
|
|
67
|
+
│ └── dto.ts # DTO 타입 정의
|
|
76
68
|
└── entities/
|
|
77
69
|
└── {moduleName}/ # Swagger 태그별 모듈
|
|
78
70
|
└── api/
|
|
@@ -82,124 +74,28 @@ src/
|
|
|
82
74
|
└── mutations.ts # TanStack Mutation 훅
|
|
83
75
|
```
|
|
84
76
|
|
|
85
|
-
##
|
|
86
|
-
|
|
87
|
-
### 1. API 인스턴스 설정
|
|
88
|
-
|
|
89
|
-
```typescript
|
|
90
|
-
// src/app/providers/api.ts
|
|
91
|
-
import ky from "ky";
|
|
92
|
-
|
|
93
|
-
export const apiInstance = ky.create({
|
|
94
|
-
prefixUrl: "https://api.example.com",
|
|
95
|
-
headers: {
|
|
96
|
-
"Content-Type": "application/json",
|
|
97
|
-
},
|
|
98
|
-
});
|
|
99
|
-
```
|
|
100
|
-
|
|
101
|
-
### 2. API 클래스 사용
|
|
102
|
-
|
|
103
|
-
```typescript
|
|
104
|
-
// src/entities/user/api/instance.ts (자동 생성됨)
|
|
105
|
-
import { UserApi } from "./index";
|
|
106
|
-
import { apiInstance } from "@/app/providers/api";
|
|
107
|
-
|
|
108
|
-
export const userApi = new UserApi(apiInstance);
|
|
109
|
-
```
|
|
110
|
-
|
|
111
|
-
### 3. TanStack Query 훅 사용
|
|
112
|
-
|
|
113
|
-
```typescript
|
|
114
|
-
// src/pages/user/ui/UserProfile.tsx
|
|
115
|
-
import { useGetUserByIdQuery } from "@/entities/user/api/queries";
|
|
116
|
-
import { useUpdateUserMutation } from "@/entities/user/api/mutations";
|
|
117
|
-
|
|
118
|
-
export const UserProfile = ({ userId }: { userId: number }) => {
|
|
119
|
-
// Query 사용
|
|
120
|
-
const { data: user, isLoading } = useGetUserByIdQuery(userId);
|
|
121
|
-
|
|
122
|
-
// Mutation 사용
|
|
123
|
-
const updateUserMutation = useUpdateUserMutation({
|
|
124
|
-
onSuccess: () => {
|
|
125
|
-
console.log("User updated successfully!");
|
|
126
|
-
},
|
|
127
|
-
});
|
|
128
|
-
|
|
129
|
-
const handleUpdate = (userData: UpdateUserRequestDto) => {
|
|
130
|
-
updateUserMutation.mutate({
|
|
131
|
-
id: userId,
|
|
132
|
-
body: userData,
|
|
133
|
-
});
|
|
134
|
-
};
|
|
135
|
-
|
|
136
|
-
if (isLoading) return <div>Loading...</div>;
|
|
137
|
-
|
|
138
|
-
return (
|
|
139
|
-
<div>
|
|
140
|
-
<h1>{user?.name}</h1>
|
|
141
|
-
<button onClick={() => handleUpdate({ name: "New Name" })}>
|
|
142
|
-
Update User
|
|
143
|
-
</button>
|
|
144
|
-
</div>
|
|
145
|
-
);
|
|
146
|
-
};
|
|
147
|
-
```
|
|
148
|
-
|
|
149
|
-
## ⚙️ 설정 옵션
|
|
150
|
-
|
|
151
|
-
### 명령행 옵션
|
|
152
|
-
|
|
153
|
-
| 옵션 | 단축키 | 설명 | 기본값 |
|
|
154
|
-
| ------------------------ | ------ | ------------------------------- | -------------------------------------------- |
|
|
155
|
-
| `--uri` | `-u` | Swagger 문서 URL 또는 파일 경로 | 필수 |
|
|
156
|
-
| `--username` | `-un` | HTTP Basic Auth 사용자명 | - |
|
|
157
|
-
| `--password` | `-pw` | HTTP Basic Auth 비밀번호 | - |
|
|
158
|
-
| `--dto-output-path` | `-dp` | DTO 파일 출력 경로 | `src/shared/api/dto.ts` |
|
|
159
|
-
| `--api-output-path` | `-ap` | API 클래스 출력 경로 | `src/entities/{moduleName}/api/index.ts` |
|
|
160
|
-
| `--query-output-path` | `-qp` | Query 훅 출력 경로 | `src/entities/{moduleName}/api/queries.ts` |
|
|
161
|
-
| `--mutation-output-path` | `-mp` | Mutation 훅 출력 경로 | `src/entities/{moduleName}/api/mutations.ts` |
|
|
162
|
-
| `--project-template` | `-pt` | 커스텀 템플릿 경로 | - |
|
|
163
|
-
|
|
164
|
-
### 경로에서 `{moduleName}` 사용
|
|
165
|
-
|
|
166
|
-
`{moduleName}`을 포함한 경로는 Swagger 태그명으로 자동 대체됩니다.
|
|
167
|
-
|
|
168
|
-
예: `User` 태그 → `user` 모듈명으로 변환
|
|
169
|
-
|
|
170
|
-
## 🔧 커스텀 템플릿
|
|
171
|
-
|
|
172
|
-
기본 템플릿을 복사하여 프로젝트에 맞게 수정할 수 있습니다:
|
|
173
|
-
|
|
174
|
-
```bash
|
|
175
|
-
# 템플릿 복사
|
|
176
|
-
cp -r templates/ ./my-templates/
|
|
177
|
-
|
|
178
|
-
# 커스텀 템플릿 사용
|
|
179
|
-
generate-all --uri ./swagger/my-api.yml --project-template ./my-templates/
|
|
180
|
-
```
|
|
181
|
-
|
|
182
|
-
## 🛠️ 개발 환경
|
|
183
|
-
|
|
184
|
-
- **Node.js**: 18+
|
|
185
|
-
- **Package Manager**: Yarn 4.7.0
|
|
186
|
-
- **Type**: ES Module
|
|
77
|
+
## ⚙️ 옵션
|
|
187
78
|
|
|
188
|
-
|
|
79
|
+
### fetch-swagger
|
|
189
80
|
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
81
|
+
| 옵션 | 설명 | 필수 |
|
|
82
|
+
| ---------- | ------------------- | ---- |
|
|
83
|
+
| --url | Swagger 문서 URL | ✅ |
|
|
84
|
+
| --username | Basic Auth 사용자명 | - |
|
|
85
|
+
| --password | Basic Auth 비밀번호 | - |
|
|
194
86
|
|
|
195
|
-
|
|
87
|
+
### generate-all
|
|
196
88
|
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
89
|
+
| 옵션 | 설명 | 기본값 |
|
|
90
|
+
| ---------------------- | --------------------- | ------------------------------------------ |
|
|
91
|
+
| --uri | Swagger 문서 URL/경로 | 필수 |
|
|
92
|
+
| --username | Basic Auth 사용자명 | - |
|
|
93
|
+
| --password | Basic Auth 비밀번호 | - |
|
|
94
|
+
| --dto-output-path | DTO 파일 경로 | src/shared/api/dto.ts |
|
|
95
|
+
| --api-output-path | API 클래스 경로 | src/entities/{moduleName}/api/index.ts |
|
|
96
|
+
| --query-output-path | Query 훅 경로 | src/entities/{moduleName}/api/queries.ts |
|
|
97
|
+
| --mutation-output-path | Mutation 훅 경로 | src/entities/{moduleName}/api/mutations.ts |
|
|
202
98
|
|
|
203
99
|
## 📄 라이선스
|
|
204
100
|
|
|
205
|
-
|
|
101
|
+
MIT © [sen2y](https://github.com/sen-jik)
|
package/package.json
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "swagger-fsd-gen",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.1",
|
|
4
4
|
"main": "index.js",
|
|
5
|
+
"description": "Swagger API client generator that creates type-safe API clients using ky and TanStack Query with Feature Sliced Design pattern. Automatically generates API client code from Swagger/OpenAPI specifications.",
|
|
5
6
|
"scripts": {
|
|
6
7
|
"test": "echo \"Error: no test specified\" && exit 1"
|
|
7
8
|
},
|
package/scripts/generate-all.js
CHANGED
|
@@ -167,17 +167,8 @@ export const generateApiCode = async ({
|
|
|
167
167
|
generateUnionEnums: true,
|
|
168
168
|
cleanOutput: false,
|
|
169
169
|
silent: true,
|
|
170
|
-
// Prettier
|
|
171
|
-
prettier:
|
|
172
|
-
semi: true,
|
|
173
|
-
trailingComma: "es5",
|
|
174
|
-
singleQuote: true,
|
|
175
|
-
printWidth: 100,
|
|
176
|
-
tabWidth: 2,
|
|
177
|
-
arrowParens: "always",
|
|
178
|
-
jsxBracketSameLine: false,
|
|
179
|
-
jsxSingleQuote: false,
|
|
180
|
-
},
|
|
170
|
+
// 프로젝트의 Prettier 설정을 사용
|
|
171
|
+
prettier: true,
|
|
181
172
|
modular: true,
|
|
182
173
|
moduleNameFirstTag: true, // Swagger 태그를 모듈명으로 사용
|
|
183
174
|
moduleNameIndex: 1,
|
|
Binary file
|