How to import octokit in browser

1.3k Views Asked by Hallojvjknvve At 04 April 2025 at 22:04

tried to follow an example from this. To import octokit I first pasted the following lines into my html document as stated by adding the following lines:

<script type="module">
import { Octokit } from "https://cdn.skypack.dev/@octokit/core";
</script>

This just resulted in an Uncaught (in promise) ReferenceError: Octokit is not defined. Moving the line in script tags directly into the script.js file above the code just made one of the main functions appear as undefined (it handled a button click that authenticated a google account and then retrieved data from google sheets via the sheets API).

I then tried all this with new html and js files, adding that code directly to the html had the same result but this time adding it to the start of the js file gives a import declarations may only appear at top level of a module script.js:1

Don't really know what to do from here so any help would be appreciated. Did find this though but it just says the issue is fixed?

Original Q&A

There are 1 best solutions below

fadingbeat On 12 February 2023 at 09:45

I think the best solution is to write your script logic in a separate javascript file, and then import that file in your html at the end of body element.

Here is an example of getting your repositories from GitHub:

repos.js

import { Octokit } from "https://cdn.skypack.dev/octokit";
import { config } from "./config.js";

const GIT_KEY = config.API_KEY;

export const octokit = new Octokit({
  auth: GIT_KEY,
});

const repo = await octokit.request(
  "GET /users/{username}/repos{?type,sort,direction,per_page,page}",
  {
    username: "your_username",
  }
);
console.log(repo);

repos.html:

<body>
  ...
  <script type="module" src="repos.js"></script>
</body>

How to import octokit in browser

There are 1 best solutions below

Related Questions in JAVASCRIPT

Related Questions in GITHUB

Related Questions in BROWSER

Related Questions in GITHUB-API

Related Questions in OCTOKIT-JS

Trending Questions

Popular # Hahtags

Popular Questions