Friday 13 November 2020

ASP .Net Core 3.1 octokit rest npm package issues

I use npm and a gulpfile.js to essentially export npm packages to a 'lib' folder under 'wwwroot'; this works a treat and whenever I update a specific npm package if it's in my gulpfile.js watch list it'll push the contents to the 'lib' folder.

The issue I have is that I used to use a manually extracted copy of ocktokit-rest in order to query the public api for some repo data. Recently this has stopped working, I assume that GitHub has updated their api which has had some breaking changes for my old version of ocktokit-rest. So with that in mind I installed @Ocktokit/rest version 18.0.9 using the npm package.json. This then creates the following directory:

~/lib/@octokit/rest/

According to the docs I need to refence one of the index.js files inside this. So because Razor doesn't appreciate the use of the @ symbol in the path I use the following in my _layout.cshtml

<script src="@Url.Content("~/lib/@octokit/rest/dist-src/index.js")" type="module"></script>

I added the type="module" as I was initially getting some issues with the import statements inside of the index.js file.

Here's the index.js file contents at the above route:

import { Octokit as Core } from "@octokit/core";
import { requestLog } from "@octokit/plugin-request-log";
import { paginateRest } from "@octokit/plugin-paginate-rest";
import { restEndpointMethods } from "@octokit/plugin-rest-endpoint-methods";
import { VERSION } from "./version";
export const Octokit = Core.plugin(requestLog, restEndpointMethods, paginateRest).defaults({
    userAgent: `octokit-rest.js/${VERSION}`,
});

This then raises the following error in the chrome debugger:

Uncaught TypeError: Failed to resolve module specifier "@octokit/core". Relative references must start with either "/", "./", or "../".

I don't particularly like the idea of adjusting the @octokit/ reference in favour of '../../' because then every time my gulpfile.js npm push task runs I'll have to manually change this file. However for the sake of debugging this I went through and adjusted index.js to look like this:

import { Octokit as Core } from "../../core";
import { requestLog } from "../../plugin-request-log";
import { paginateRest } from "../../plugin-paginate-rest";
import { restEndpointMethods } from "../../plugin-rest-endpoint-methods";
import { VERSION } from "./version";
export const Octokit = Core.plugin(requestLog, restEndpointMethods, paginateRest).defaults({
    userAgent: `octokit-rest.js/${VERSION}`,
});

When I did this I got similar error messages for each import that looked something like this:

index.js:4 GET https://localhost:44364/lib/@octokit/plugin-rest-endpoint-methods net::ERR_ABORTED 404

Now the above URL is pointed at the directory not a specific file, if I run the above through to a single file I can see it load in the browser and display the file. So If I type:

https://localhost:44364/lib/@octokit/plugin-rest-endpoint-methods/dist-src/endpoints-to-methods.js

I can see the js file displayed in the browser so I know it can be pathed to. Now Ideally I want to be able to use this package in another bit of custom js I wrote that iterates through my repos and creates nice little cards with all the info on, so I'm basically just trying to use it like this:

var octokit = new Octokit({ userAgent: 'agentName' });

But obviously the above is complaining about the existence of Octokit.

So I guess my question is, what the frack? I'm obviously missing something here so if anyone has any ideas in what direction I need to look or research I'd be very grateful.

It's probably nothing to do with the octokit package at all, and much more likely that I just don't understand how to properly import these types of JavaScript libraries into my asp .net core solution



from ASP .Net Core 3.1 octokit rest npm package issues

No comments:

Post a Comment