Reference GitHub file in jsFiddle

问题:

Is there a possibility to misuse grab files from a github repo as external resources in jsFiddle?

回答1:

This is an updated answer, since the url's have changed slightly for Github... I ran into this issue and figured it out for present day. Hopefully this helps people out finding this post recently. Example for Bootstrap Slate theme from Bootswatch:

1. Raw file url: https://raw2.github.com/thomaspark/bootswatch/gh-pages/slate/bootstrap.css

2. Remove the 2. after raw: https://rawgithub.com/thomaspark/bootswatch/gh-pages/slate/bootstrap.css

That's it! :D

回答2:

TLDR; Visit rawgit.com which will pop your files on a CDN straight from GitHub so you can use them.

Unfortunately none of the answers here worked for me. The rawgithub URL didn't seem to work as the connection gets refused. So here's a full solution that did work. Firstly in GitHub you need to click the Raw button to get the original JavaScript.

Then copy the URL from the page it takes you too. You'll notice if you try and use this directly you'll get a warning from JSFiddle.

More to the point is the browser will give you an error, e.g.:

Refused to execute script from https://raw.githubusercontent.com/nnnick/Chart.js/master/Chart.min.js' because its MIME type ('text/plain') is not executable, and strict MIME type checking is enabled.

Take that URL and visit rawgit.com. This will give you a URL of the format https://rawgit.com/nnnick/Chart.js/master/Chart.min.js which you can then use.

I've tried and tested this and it seems to work fine without issue

回答3:

Another possibility is to add the Git library to the cdnJS Script Repository (they write that any library that is resonably popular on GitHub will be accepted) and then use it as external resource.

Just found out: there are lots of Javascript libraries at http://jsdb.io/ and it's very easy to add new ones there--i's just a matter of entering the URL of a Github repository.

回答4:

If there is a git repo in following folder structure

fiddletest/test1 (fiddletest is the repo name and test1 is a folder)

then the corresponding jsfiddle link will be

http://jsfiddle.net/gh/get/<library name>/<version>/<github user name>/fiddletest/tree/master/test1/

The folder and file structure must be like this

fiddletest(the repo name)
|____ test1
      |____ demo.html
      |____ demo.js
      |____ demo.css
      |____ demo.details 

except these three files others will be ignored. the details file should hold the fiddle details and link of external resources(if any) as follows

---
name: test fiddle repo
description: this is a test repo
resources: 
  - http://abc.xyz.com/abc.js
  - http://abc.xyz.com/abc2.js
...

May be you have noticed the and in the fiddle link. If a fiddle is with pure js the the library name should be "library" and the version should be "pure"

In a nutshell the fiddle link to reffer to github should be in following format

http://jsfiddle.net/gh/get/<library name>/<version>/<github user name>/<repo name>/tree/<branchname>/<folder name>/

回答5:

Nowadays JSDelivr seems to be the best option.