TypeError: fetch is not a function, What did I do wrong?

Question

I'm trying to use node-fetch in order to fetch this website that has this JSON file where I can use it for my discord bot.

Code (JS):

const fetch = import("node-fetch")

// some code until

data = ""
        try {
            data = await fetch(`http://meme-api.herokuapp.com/gimme/${subreddit.toLowerCase()})}`).then(res => res.json)
            errored = false
        } catch (error) {
            throw error;
        }

It errors saying:

TypeError: fetch is not a function

How do I fix this?

FYI, Using require() resulted in an error as such:

const fetch = require("node-fetch")
              ^

Error [ERR_REQUIRE_ESM]: require() of ES Module F:\Users\Basil Atif\Folders\VsauceBot\node_modules\node-fetch\src\index.js from F:\Users\Basil Atif\Folders\VsauceBot\src\Commands\reddit.js not supported.
Instead change the require of index.js in F:\Users\Basil Atif\Folders\VsauceBot\src\Commands\reddit.js to a dynamic import() which is available in all CommonJS modules.    
  code: 'ERR_REQUIRE_ESM'
}

Answer 1

Error:

let get=document.getElementById("get");
let **fetch**=document.getElementById("fetch"); //this var create problem
let content=document.getElementById("content");


function getData(){

    
    let url= "https://api.github.com/users/github";
    fetch(url).then(
        (res)=>{
        return res.text();
    }).then((data)=>{
    content.innerHTML = data;
    });

}
getData()

output: Error

Solution:

let get=document.getElementById("get");
let **fet**=document.getElementById("fetch");// change the name of the variable
let content=document.getElementById("content");


function getData(){

    
    let url= "https://api.github.com/users/github";
    fetch(url).then(
        (res)=>{
        return res.text();
    }).then((data)=>{
    content.innerHTML = data;
    });

}
getData()

output: now the data is fetched

Answer 2

Try using this style of import:

import fetch from 'node-fetch';