一些框架和外掛的cdn引用

1：bootstrap

bootstrap.css的cdn引用：<link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.2.0/css/bootstrap.min.css" />

bootstrap.js的cdn引用：<script src="http://i.gtimg.cn/qzone/biz/gdt/lib/bootstrap-3.3.7/js/bootstrap.min.js?max_age=31536000"></script>

2：基於jquery寫的外掛toastr

css：<link href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css" rel="stylesheet"/>

js：<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>

3：jquery

<script src="http://i.gtimg.cn/qzone/biz/gdt/lib/jquery/jquery-2.1.4.js?max_age=31536000"></script>

4：vue.js

  <script src="https://unpkg.com/vue/dist/vue.js"></script>

5：基於vue.js的外掛vue-router.js

 這是vue-router.js的原始碼地址： <script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>

6：vuex的開發文件

7：基於vue.js的懶載入外掛lazyload.js

8：基於vue.js實現後臺伺服器的代理

axios

9：better-scroll（對iScroll的擴充套件）的Github地址

文件

10：vue lazyload.js(實現懶載入技術)的Github地址

在vue中使用vue-lazyload的步驟

1）首先按照官網上面的方法，在命令面板中進入專案 的根目錄，然後使用npm安裝vue-lazyload到專案中

npm install vue-lazyload --save 

2）在main.js檔案裡面，引入外掛vue-lazyload

import VueLazyLoad from 'vue-lazyload'

3）在main.js裡面使用Vue.use()方法對VueLazyLoad進行 宣告，這裡的設定可以參照官網說明進行定義

Vue.use(VueLayLoad,{loading:require('圖片地址')})

4）然後，在有需要進行預載入的地方使用指令v-lazy='圖片的地址'，下面是一個簡單的例子

<img v-lazy='item.avatar' width='50' height='50'>

以上就是使用vue-lazyload載入技術的步驟。

總結：vue-lazyload.js外掛是一處定義，多處使用

11：cretae-keyframe-animation第三方js動畫外掛

利用js建立css3動畫，因為css動畫需要知道元素的位置，所以需要用js獲取元素的位置，這裡引入第三方動畫外掛create-keyframe-animation實現這個功能.

在vue中利用javascript鉤子函式，在結合第三方動畫外掛，實現一些複雜的動畫效果。

javascript的鉤子函式有：before-enter    enter   after-enter    before-leave   leave   after-leave，具體用法可以看手冊。

件create-keyframe-animation的github地址如下所示：

12：在Vue中對base64的字串進行解碼，使用第三方js外掛庫js-base64進行解析

13：利用js-base64解碼之後是一個字串，現在需要對這些字串進行處理，得到我們想要的資料的格式，lyric-parse.js是一個第三方的js外掛，可以將字串格式的歌詞轉化為我們需要的資料格式

14：在vue專案中使用jsonp.js外掛，實現跨域請求

jsonp.js的github地址：點選開啟連結

15：Flow是 facebook 出品的 JavaScript 靜態型別檢查工具

https://flow.org/en/docs/types/

16：通過npmjs官網可以找到很多的外掛的介紹：

官方地址

18：npm的官方地址     詳細地址       https://www.npmjs.com/  通過這個網址可以找到很多外掛的詳細使用官方地址