鍍金池/ 問(wèn)答/HTML/ vue2 項(xiàng)目中index.html頁(yè)面如何根據(jù)不同的環(huán)境引入不同的CDN文件

vue2 項(xiàng)目中index.html頁(yè)面如何根據(jù)不同的環(huán)境引入不同的CDN文件

clipboard.png

如圖所示,由vue-cli生成的項(xiàng)目,index.html頁(yè)面 head部分使用 <script>標(biāo)簽引入第三方的js

需求是這樣的,比如在普通瀏覽器訪問(wèn)需要引入高德地圖,但是在微信中打開(kāi)不需要引入高德地圖... 還有些場(chǎng)景可能添加或移除第三方的js

求教各位大佬,如何實(shí)現(xiàn)這種需求

回答
編輯回答
櫻花霓

使用異步加載,但是要注意插入的形式,放在頭部還是尾部,defer還是async 需要看你的需求,原則是不js 的加載和執(zhí)行不阻塞dom的解析和渲染

2017年11月19日 10:41
編輯回答
臭榴蓮

對(duì)瀏覽器做判斷

window.navigator.userAgent

針對(duì)瀏覽器做不同的邏輯

附判斷微信瀏覽器的:

isWeiXin () {   
    var ua = window.navigator.userAgent.toLowerCase()      
    if (ua.match(/MicroMessenger/i)) {    
        if (ua.match(/MicroMessenger/i)[0] === 'micromessenger') {
             return true    
         } else {
             return false    
         }   
    } else {    
        return false   
    } 
}
2017年10月24日 00:16
編輯回答
安于心
(function() {
                var jssrc = ''
                if(ua.match(/MicroMessenger/i)=="micromessenger"){
                    jssrc='xxx/a.js'
                } else {
                    jssrc = 'xxx/b.js'
                }
                var myJs= document.createElement("script");
                myJs.src = jssrc;
                var s = document.getElementsByTagName("script")[0];
                s.parentNode.insertBefore(myJs, s);
              })();
2018年4月30日 20:20
編輯回答
拼未來(lái)
function isWechat() {
    var ua = navigator.userAgent.toLowerCase();

    if(ua.match(/MicroMessenger/i)=="micromessenger")
        return true;
    else
        return false;
}

if( isWechat()){
    docment.write("<script src='a.js'></script>");
}else{
    docment.write("<script src='b.js'></script>");
}
2017年1月16日 21:31