1.如何引入

在vue-cli里，引入文件有幾鐘方法

一種是用npm或者cnpm指令去下載對應(yīng)的插件，然后在main.js里用import方法引入，這里不討論這種方法

我比較喜歡采用的是直接下載對應(yīng)的js，然后引入到vue項(xiàng)目中去

問題來了，如何引入呢

方法如下：

在這里，分別是

<link rel="stylesheet" href="./static/layer.css" rel="external nofollow" />   <script src="./static/jquery.js"></script>   <script src="./static/jquery.min.js"></script>   <!-- 必須先引入上面jq 1.8版本以上的才能引layer -->   <script src="./static/layer.js"></script>

這樣在全局文件里都可以使用layer彈出層插件了，需要注意，必須先引入jq 1.8以上的版本才可以使用layer噢。

2.彈出層顯示不出

ps：下面看下在Vue中使用layer.js彈出層插件

layer.js(mobile)是一個(gè)小巧方便的彈出層插件，在之前的apicloud項(xiàng)目中被大量使用，但最近對apicloud的IDE、非常不友好的文檔和極低的開發(fā)效率深感厭煩，決定棄用然后轉(zhuǎn)向Vue開發(fā)。在開發(fā)過程中引入layer.js的時(shí)候遇到了麻煩。原因是layer.js不支持import導(dǎo)入，這時(shí)就需要修改一下它的源碼。在看過它的源碼后，發(fā)現(xiàn)需要修改的地方只有兩處，

源碼中已經(jīng)暴露了一個(gè)全局變量layer，故只需在腳本末尾處添加

export default layer;1

這表示將這個(gè)全局變量導(dǎo)出。

然后在文件中找到下面的代碼注釋掉，這段代碼是為layer添加樣式的，但使用的路徑不對，故沒有太大幫助。

document.head.appendChild(function() {  var link = doc.createElement('link');  link.href = path + 'need/layer.css?2.0';  link.type = 'text/css';  link.rel = 'styleSheet'link.id = 'layermcss';  return link;} ());

接下來把layer.js和layer.css分別放入static/js和static/css中，在需要的地方，比如組件內(nèi)部或者全局注冊，因?yàn)轫?xiàng)目多處都會用到，所以采用全局注冊，在main.js中