javascriptweb-deploymentgithub-pagesinternal-link

How to load local JavaScript libraries in Github Pages?

I recently deployed my website to GitHub Pages - https://max-stevenson.github.io/my-year-in-books/

I have a two local JavaScript libraries (jQuery and swiped-events) downloaded and within the following directory: src/public/js/lib.

In my index.html file at the root directory, I am linking to the two libraries like so:

<script type="text/javascript" src="/src/public/js/lib/jquery-3.4.1.min.js"></script>
<script src="/src/public/js/lib/swiped-events.js"></script>

But when I access the page on GitHub Pages I get the following errors:

GET https://max-stevenson.github.io/src/public/js/lib/jquery-3.4.1.min.js net::ERR_ABORTED 404 (Not Found)
GET https://max-stevenson.github.io/src/public/js/lib/swiped-events.js net::ERR_ABORTED 404 (Not Found)

When I run a local instance on my machine via a node express server and visit the site at localhost:3000, everything works great.

Can anyone please advise me where I'm going wrong and how to correctly reference my scripts so that they are loaded in GitHub Pages?

Solution

  • Try:

    <script type="text/javascript" src="/my-year-in-books/scr/js/lib/jquery-3.4.1.min.js"></script

    Or:

    <script type="text/javascript" src="./scr/public/js/lib/jquery-3.4.1.min.js"></script