https://github.com/ozylog/vetch
Simple fetch-wrapper
https://github.com/ozylog/vetch
fetch fetch-wrapper typescript
Last synced: 6 months ago
JSON representation
Simple fetch-wrapper
- Host: GitHub
- URL: https://github.com/ozylog/vetch
- Owner: ozylog
- License: mit
- Created: 2018-06-20T02:58:46.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2023-01-06T01:58:02.000Z (over 3 years ago)
- Last Synced: 2025-09-14T22:51:38.932Z (7 months ago)
- Topics: fetch, fetch-wrapper, typescript
- Language: TypeScript
- Homepage:
- Size: 1.41 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 14
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# vetch
Simple fetch-wrapper
## Install
```
yarn add vetch
```
## Setup
For nodejs, please install [node-fetch](https://www.npmjs.com/package/node-fetch) package then call function `setVetch` in main or index file.
```
import { setVetch } from 'vetch';
import fetch from 'node-fetch';
setVetch({ fetch });
```
For browser, please install [whatwg-fetch](https://www.npmjs.com/package/whatwg-fetch) then import that package in main or index file.
```
import 'whatwg-fetch';
```
## Perks
- Browser and node compatible
- Built-in typings. Please add `dom` in `compilerOptions.lib` in your tsconfig.json
- What you can do on fetch, you can do on vetch too.
- Zero dependencies
## Request
```
vetch(url: string, options?: Options)
```
Options
All fetch [optional fields](https://github.github.io/fetch/#options) plus additional fields below.
| field | type |
|---------|------------------------------------------------------------------|
| query | Object |
| payload | [options.body](https://github.github.io/fetch/#request-body) + Object |
## Chained Methods
Some methods for response.body:
- text()
- json()
- blob() *
- arrayBuffer() *
- formData() *
You can chain those methods after `vetch()` function. See [usage examples](#usage-examples) below for details.
(*) Some methods are not available on certain fetch versions
## Response
Same as [Fetch response](https://github.github.io/fetch/#Response) with additional field called `data` which contains parsed data of the response body if `vetch` will be called alongside with one of the [chained methods](#chained-methods) above.
## Usage Examples
```
interface ResData {
name: string;
}
const { data, headers } = await vetch('/users').json();
// note: data is json parsed response body
// data has type ResData[]
// support object for request.query
const { data, headers } = await vetch('/users', {
query: {
ids: [ 1, 2 ],
city: 'auckland'
}
}).json();
// note: for url /users?ids[]=1&ids[]=2&city=auckland
// data has type ResData[]
// support object for request.body
const { data, headers } = await vetch('/users', {
method: 'POST',
payload: { name: 'John'}
}).json();
// fetch.option.body: JSON.stringify({ name: 'John' }) equivalent
// data has type ResData
// If you don't need to parse response body
const response = await vetch('/users');
```
## License
MIT