1. Home
    2. »
  2. General
    3. » Using GitHub to jsDelivr CDN

Using GitHub to jsDelivr CDN

General
admin

enter image description here

Did you know that you can use the wonderful and FREE JSDelivr CDN to deliver your GitHub project files? Yes, you can!

For instance, go here and enter the URL to one of your GitHub project files. You will enter in this type of format and MUST be done for each file:

https://github.com/oleteacher/Qik-Exit-Intent-Popup/blob/main/js/bioep.min.js

Then the JSDelivr page will return something like this:

https://cdn.jsdelivr.net/gh/oleteacher/Qik-Exit-Intent-Popup@main/js/bioep.min.js

Here’s how it works.

jsDelivr CDN service’s base URL is https:// cdn.jsdelivr.net/gh/{username}/{repo}/, where you replace {username} with the GitHub username and {repo} with the repository name for the project.

Append that URL with the path to the file you want to access in the project. For example, consider my sample project Github-As-CDN , the JavaScript file(dummy-js-file.js) is located in the /dist directory.

<html>

<script src="https://cdn.jsdelivr.net/gh/root0109/github-cdn/dist/dummy-js-file.js"></script>

</html>

You can also take advantage of semantic versioning by adding @{version-number} to the repository name. You can target major, minor, and patch releases as desired.

Load the latest version

<script src="https://cdn.jsdelivr.net/gh/root0109/github-cdn/dist/dummy-js-file.js"></script>

Load with Major Version only

<script src="https://cdn.jsdelivr.net/gh/root0109/github-cdn@2/dist/dummy-js-file.js"></script>

Load with Major.Minor Version

<script src="https://cdn.jsdelivr.net/gh/root0109/[email protected]/dist/dummy-js-file.js"></script>

Load Exact version

<script src="https://cdn.jsdelivr.net/gh/root0109/[email protected]/dist/dummy-js-file.js"></script>

Load minified version Add “.min” to any JS/CSS file to get a minified version — if one doesn’t exist, it will be automatically generated for you.

That is all there is to it!

Tags