2014-09-28 34 views
2

我想僅包含一個用於IE8瀏覽器的JavaScript文件。例如:如何在meteor.js包中包含用於IE8瀏覽器的JavaScript文件?

<!--[if lt IE 9]> 
    <script src="js/ie/html5shiv.js"></script> 
    <![endif]--> 

我使用我的流星包繼package.js代碼:

Package.onUse(function (api) { 
    api.versionsFrom("[email protected]"); 
    api.use('jquery'); 
    var path = Npm.require('path'); 
    var asset_path = path.join('js); 
    // Surround following code in <!--[if lt IE 9]> and <![endif]--> tags somehow!!!! 
    api.addFiles(path.join(asset_path, 'ie', 'html5shiv.js'), 'client'); 
} 

我知道,最終方案將包含所有js文件組合在一個js文件的縮小版本。在這種情況下,我想有代碼的樣子:

<!--[if lt IE 9]> 
    // Contents of html5shiv.js here! 
<![endif]--> 

回答

1

這裏是我提出解決方案,可惜我不能測試它,因爲我可以在此刻沒有Windows環境。

my-package/client/views/lib/head.html

<head> 
    <!--[if lt IE 9]> 
     <meta name="lower-than-ie9"> 
    <![endif]--> 
</head> 

head和流星Spacebars模板語法body標籤被特殊處理:無論你這些標籤之間放(它們可以出現多次)將獲得附加到最終的HTML文檔。

這就是爲什麼我們這個流星模板的代碼添加到產品包:如果IE版本比IE9是低,它最終將創建一個meta標籤名稱爲lower-than-ie9,我們可以在以後的測試存在或不存在。

my-package/client/lib/my-package.js

Meteor.startup(function(){ 
    // search for the meta tag appended by the conditional inclusion comment 
    if($("meta[name='lower-than-ie9']").length){ 
    // if it's there, load the script with jQuery 
    $.getScript("/my-package/public/html5shiv.js"); 
    } 
}); 

你需要把html5shiv.js腳本在你的包的公共目錄:

my-package/public/html5shiv.js

這是包,你將需要結構:

my-package/package.js

Package.onUse(function(api){ 
    api.versionsFrom("[email protected]"); 
    api.use("jquery","client"); 
    api.addFiles([ 
    "client/views/lib/head.html", 
    "client/lib/my-package.js" 
    ],"client"); 
    // specify that the script is an asset to prevent it from 
    // being minimized and bundled to the client 
    api.addFiles("public/html5shiv.js","client",{ 
    isAsset:true 
    }); 
}); 
+0

有趣的解決方案!我在想如果這可以做到不污染Meteor.startup func。希望我的軟件包能夠開箱即用。也許我應該編輯html5shiv.js,並將其所有內容放在「」「if(!document.addEventListener){//html5shiv.js content here!}」「」中。你怎麼看? – 2014-09-29 16:26:55

+0

爲什麼不把'script'標籤直接放在頭部,在條件內? – Gigo 2015-12-03 23:57:54

相關問題