Updated on JavaScript

JavaScript Fetch Is Not Defined

The “ReferenceError: fetch is not defined” error occurs when the fetch() method is used in an environment where it’s not supported – most commonly NodeJs. To solve the error, install and import the node-fetch package, which provides a fetch() compatible API on NodeJs runtime.

To solve the “ReferenceError: fetch is not defined” error install and import the node-fetch package.

If your project does not have a package.json file, create one first in your project’s root directory:

# only run this if you don't have package.json file yet
npm init -y

Now install the node-fetch library.

npm install node-fetch

Now you can import and use the module just like you would use the fetch() method in your browser.

import fetch from 'node-fetch';

async function getUser() {
  try {
    const response = await fetch('https://random.me/api/');

    if (!response.ok) {
      throw new Error(`Error! status: ${response.status}`);
    }

    const result = await response.json();
    return result;
  } catch (err) {
    console.log(err);
  }
}

console.log(await getUser());

Note that, at the time of writing, to use ES6 module imports and exports in a NodeJs project, you have to set the type property to module in your package.json file:

{
  "type": "module",
  // ... rest
}

If you’re using TypeScript, you don’t have to install types for the node-fetch package as they are included by default.

If I run my NodeJs script now, I get the result from calling the API back.

The more recent versions of the node-fetch package are only compatible with the ES6 Modules syntax of import/export. If you are using an older NodeJs version, simply install version 2 of the node-fetch package.

Recommended Articles