JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 4943826
  • Score
    100M100P100Q195783F
  • License MIT

Bare minimum fetch polyfill in 500 bytes

Package Exports

  • unfetch
  • unfetch/dist/unfetch
  • unfetch/package.json
  • unfetch/polyfill

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (unfetch) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

unfetch
npm travis

unfetch

Tiny 500b fetch "barely-polyfill"

  • Tiny: under 500 bytes of ES3 gzipped
  • Minimal: just fetch() with headers and text/json/xml responses
  • Familiar: a subset of the full API
  • Supported: supports IE8+ (BYOP)
  • Standalone: one function, no dependencies
  • Modern: written in ES2015, transpiled to 500b of old-school JS

🤔 What's Missing?

  • Uses simple Arrays instead of Iterables, since Arrays are iterables
  • No streaming, just Promisifies existing XMLHttpRequest response bodies

Table of Contents


Install

This project uses node and npm. Go check them out if you don't have them locally installed.

$ npm install --save unfetch

Then with a module bundler like rollup or webpack, use as you would anything else:

// using ES6 modules
import fetch from 'unfetch'

// using CommonJS modules
var fetch = require('unfetch')

The UMD build is also available on unpkg:

<script src="//unpkg.com/unfetch/dist/unfetch.umd.js"></script>

This exposes the unfetch() function as a global.


Usage

As a ponyfill:

import fetch from 'unfetch';

fetch('/foo.json')
  .then( r => r.json() )
  .then( data => {
    console.log(data);
  });

Globally, as a polyfill:

import 'unfetch/polyfill';

// "fetch" is now installed globally if it wasn't already available

fetch('/foo.json')
  .then( r => r.json() )
  .then( data => {
    console.log(data);
  });

Examples & Demos

Real Example on JSFiddle ➡️

// simple GET request:
fetch('/foo')
  .then( r => r.text() )
  .then( txt => console.log(txt) )


// complex POST request with JSON, headers:
fetch('/bear', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({ hungry: true })
}).then( r => {
  open(r.headers.get('location'));
  return r.json();
})

Contribute

First off, thanks for taking the time to contribute! Now, take a moment to be sure your contributions make sense to everyone else.

Reporting Issues

Found a problem? Want a new feature? First of all see if your issue or idea has already been reported. If it hasn't, just open a new clear and descriptive issue.

Submitting pull requests

Pull requests are the greatest contributions, so be sure they are focused in scope, and do avoid unrelated commits.

💁 Remember: size is the #1 priority.

Every byte counts! PR's can't be merged if they increase the output size much.

  • Fork it!
  • Clone your fork: git clone https://github.com/<your-username>/unfetch
  • Navigate to the newly cloned directory: cd unfetch
  • Create a new branch for the new feature: git checkout -b my-new-feature
  • Install the tools necessary for development: npm install
  • Make your changes.
  • npm run build to verify your change doesn't increase output size.
  • npm test to make sure your change doesn't break anything.
  • Commit your changes: git commit -am 'Add some feature'
  • Push to the branch: git push origin my-new-feature
  • Submit a pull request with full remarks documenting your changes.

License

MIT License © Jason Miller