Hosting js file in git hub pages
I am developing a custom template for Canvas LMS and Canvas allows to upload .js and .css file. To test any changes in .js I have to re-upload .js and refresh which is time consuming. So to get around this situation I thought about hosting one js file in Git and upload another js script in Canvas with some code to facilitate link between .js (Canvas and Git).
It works but, when I commit new changes then it stops working. In brief it fails to read latest commit and keeps loading previous commit.
Codes that I am testing with are provided below:
Canvas.js is the script that I upload in Canvas LMS:
var path = 'https://cdn.jsdelivr.net/gh/G0dS0n/Scaffold@main/script.js';
(function() { var script = document.createElement('script'); script.src = path; script.async = true; script.charset = "UTF-8"; script.onload = function() { console.log("Script from GitHub loaded successfully!"); }; script.onerror = function() { console.error("Failed to load the script from GitHub."); }; document.body.appendChild(script); })(); Index.html <body> <p><a class="customAlertLink" href="#">Click Me!</a></p> </body> myScript.js (Uploaded in git) document.addEventListener("DOMContentLoaded", function() { var link = document.querySelector(".customAlertLink");
if (link) { link.addEventListener("click", function(event) { event.preventDefault(); alert("This alert is from the script hosted on GitHub!"); }); } });
(function() { var script = document.createElement('script'); script.src = path; script.async = true; script.charset = "UTF-8"; script.onload = function() { console.log("Script from GitHub loaded successfully!"); }; script.onerror = function() { console.error("Failed to load the script from GitHub."); }; document.body.appendChild(script); })(); Index.html <body> <p><a class="customAlertLink" href="#">Click Me!</a></p> </body> myScript.js (Uploaded in git) document.addEventListener("DOMContentLoaded", function() { var link = document.querySelector(".customAlertLink");
if (link) { link.addEventListener("click", function(event) { event.preventDefault(); alert("This alert is from the script hosted on GitHub!"); }); } });
1 Reply
you are using git wrong
when developing in your machine, you can use the live webpage extension for vscode (should be included out of the box) or host it with
python -m http.server 8080 if you have python installed
or use one of the many local host options
then, you develop and test IN YOUR MACHINE
after you do your stuff, use your ide tools to make commits to github