使用 jsDelivr 访问 GitHub 资源

jsDelivr-适用于 npm 和 github 的免费开源 CDN

一个简单的图表描绘它是如何工作的

也就是说你在 GitHub 上的项目文件,如果需要引用的话,可以通过它进行镜像加速

比如在 GitHub 上创建的库

通过 jsDelivr 引用 custom.css 文件

//cdn.jsdelivr.net/gh/tianlunvip/html5-javascript-css3/css/custom.css

格式:

//cdn.jsdelivr.net/gh/用户名/库名@版本号/文件路径

创建版本号

引用

//cdn.jsdelivr.net/gh/tianlunvip/html5-javascript-css3@1.0/css/custom.css
或
//cdn.jsdelivr.net/gh/tianlunvip/html5-javascript-css3@v1.0/css/custom.css

区别在于版本号 html5-javascript-css3@1.0 前加了 v

如果你在创建库版本号的时候加了 V,引用的话要加两个 V 符号了

//cdn.jsdelivr.net/gh/tianlunvip/html5-javascript-css3@vv1.0/css/custom.css

“v” 符号后面的才是版本号的名称

还可以合并多个文件,再进行引用

格式如下

//cdn.jsdelivr.net/combine/gh/用户名/库名@版本号/文件路径,gh/用户名/库名@版本号/文件路径

不同文件用 “,” 号隔开

若要使用缩小版本功能,则将“.min”添加到任何 JS/CSS文件名中,jsDelivr 将自动生成文件。

//cdn.jsdelivr.net/gh/tianlunvip/html5-javascript-css3@vv1.0/css/custom.min.css

 

常用引用库连接

<!--  jquery  -->
<script src="//cdn.jsdelivr.net/npm/jquery@2.1.4/dist/jquery.min.js"></script>

<!--  bootstrap  -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/css/bootstrap.min.css">
<script src="//cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/js/bootstrap.min.js"></script>

<!--  font-awesome  -->
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css">

<!--  nprogress  -->
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/nprogress@0.2.0/nprogress.min.css">
<script src="//cdn.jsdelivr.net/npm/nprogress@0.2.0/nprogress.min.js"></script>

<!--  prettify  -->
<link rel="stylesheet" href="//cdn.jsdelivr.net/gh/google/code-prettify/src/prettify.min.css">
<script src="//cdn.jsdelivr.net/gh/google/code-prettify/src/prettify.min.js"></script>

<!--  html5shiv  -->
<script src="//cdn.jsdelivr.net/npm/html5shiv"></script>

<!--  respond.js  -->
<script src="//cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script>

<!--  normalize.css  -->
<script src="//cdn.jsdelivr.net/npm/normalize.min.css@8.0.0/normalize.min.css"></script>

<!--  jquery.lazyload  -->
<script src="//cdn.jsdelivr.net/npm/jquery-lazyload@1.9.7/jquery.lazyload.min.js"></script>

<!--  snarl  -->
<script src="//cdn.jsdelivr.net/gh/hoxxep/snarl/dist/snarl.min.css"></script>
<script src="//cdn.jsdelivr.net/gh/hoxxep/snarl/dist/snarl.min.js"></script>

<!--  waves  -->
<script src="//cdn.jsdelivr.net/gh/fians/waves/dist/waves.min.css"></script>
<script src="//cdn.jsdelivr.net/gh/fians/waves/dist/waves.min.js"></script>

<!--  Qrcode.js  -->
<script src="//cdn.jsdelivr.net/gh/davidshimjs/qrcodejs/qrcode.min.js"></script>

<!--  clipboard.js  -->
<script src="//cdn.jsdelivr.net/gh/zenorocha/clipboard.js/dist/clipboard.js"></script>

<!--  mixitup.js  -->
<script src="//cdn.jsdelivr.net/gh/patrickkunka/mixitup/dist/mixitup.min.js"></script>



评论

还没有任何评论,你来说两句吧!