JSPM - 包含使用導入的客戶端庫文件vs使用腳本標記有什麼優點/缺點？

我開始在我的奧裏利亞Web項目使用JSPM，我想知道是否有使用import "<client side library>"任何後果或優勢？JSPM - 包含使用導入的客戶端庫文件vs使用腳本標記有什麼優點/缺點？

我見過這樣的代碼JS類中因此對於客戶端庫：

import "jquery"; 
import "bootstrap/css/bootstrap.css!" 
import "bootstrap"; 

export class App { 
    constructor { 

    } 
}

問題：什麼是進口這種方式之間的區別/優點/缺點是反對傳統的包括<script>和<link>標籤在.html文件中？

<html> 
<head> 
    <link rel="stylesheet" src="<bootstrap path>/bootstrap.css"> 
</head> 
<body> 

    <script type="text/javascript" src="<bootstrap path>/bootstrap.js"></script> 
</body> 
</html>

我的試驗和錯誤讓我發現，通過在特定的類/ js文件使用import，它限制了圖書館該特定視圖文件作爲反對正在全球範圍內提供。

最後，當你去建立這些項目進行生產，不這些庫需要在index.html的，以存在？

來源

2015-12-17 TheLazyChap

我的觀點是：你應該使用import關鍵詞，這是爲什麼：

的風格問題：這是ES6風格，並Aurelia路上有點兒迫使你使用它
可讀性重要：其他開發人員會希望你使用import，所以它可能會混淆他們
再次，import負責加載，所以如果你只是添加一個腳本標籤，你可能會添加s ome import然後可能重新聲明一些函數。
美容：我不認爲這是非常漂亮的有100個<script>標籤在你的代碼
捆綁生產。你會用Grunt還是Gulp來連接和醜化所有這些？如果是這樣，那就是額外的工作，因爲在默認配置中它是開箱即用的。如果沒有......呃，不，你應該做的
Rollup。這裏來了最甜蜜的部分。

JSPM太棒了！這是這個項目有一點不同，但 - 它結合了存儲庫的軟件包管理器和客戶端模塊裝載機，而不是簡單地捆紮模塊。 JSPM允許你使用任何模塊格式，甚至發展離不開一個構建步驟，所以它是用於創建應用的絕佳選擇。 Rollup會生成較小的捆綁包，它們不使用複雜的SystemJS格式，因此創建庫的選擇也是更好的。 JSPM的未來版本可能會使用匯總內部，所以你會得到兩全其美的。

彙總是使用import另一個親。它所做的就是翻錄你使用的庫，並獲取所需的最少量的代碼，所以如果你只需要一些東西，比如jQuery，你不需要讓你的訪問者下載50KB（或者它多少現在？）。

您可以閱讀更多關於Rollup here。

來源

2015-12-17 11:36:58

非常感謝，感謝您的解釋。我仍然對捆綁和美容部分感到困惑。在我目前的工作流程中，我將uglify +連接成1個lib.css文件1個app.css和1個lib.js + 1個app.js.所以索引中只會有4個文件。我會看看Rollup，它看起來很有希望。 – TheLazyChap

@TheLazyChap可能你會發現這篇文章捆綁有趣的http://blog.durandal.io/2015/06/23/bundling-an-aurelia-application/ –

不要忘記，導入照顧的依賴。如果代碼導入依賴於其他模塊的模塊（取決於其他模塊以及其他模塊），則所有依賴項都會以正確的方式加載，但在構建模塊時，它會依賴於內存。此外，您不使用代碼的aurelia rip捆綁過程，並將您使用的模塊和依賴項捆綁到運行時的性能 –

JSPM - 包含使用導入的客戶端庫文件vs使用腳本標記有什麼優點/缺點？

回答

相關問題