首頁 > web前端 > js教程 > 在ASP.NET MVC專案中使用RequireJS函式庫的用法範例_javascript技巧

在ASP.NET MVC專案中使用RequireJS函式庫的用法範例_javascript技巧

WBOY
發布: 2016-05-16 15:15:33
原創
1956 人瀏覽過

RequireJS 是一個前端模組化開發的流行工具,本身就是一個Javascript的庫文件,即require.js 。
RequireJs的主要功能:

(1)實作js檔案的非同步加載,避免網頁失去回應;

(2)管理模組之間的依賴性,便於程式碼的編寫與維護。

前端模組化開發現在有很多的工具,大體上分為兩類,一類是像dojo之類的高大全,dojo v1.8之後已經內置了模組化開發組件;另一類是像require .js,sea.js 這種專心做模組化開發的工具。

從模組化劃分的規則來區分,主要分為AMD、CMD兩類,dojo、require.js 遵從前者,而sea.js 依循CMD規範。

require在單一頁面應用中能夠如魚得水,然而對於傳統的多頁面應用,使用require多少會有些困惑和不方便。

本文講解如何在ASP.NET MVC的結構中應用require,並且給出了壓縮腳本,實現半自動化壓縮。

將js程式碼分離
一般而言ASP.NET MVC的一個路由對應一個視圖,視圖的檔案結構可能如下:


Views
 |--Shared
 |--_layout.cshtml
 |--Home
 |--Index.cshtml
 |--Blog
 |--Create.cshtml
 |--Edit.cshtml
 |--Detail.cshtml
 |--Index.cshtml
登入後複製

這裡假設_layout.cshtml是所有頁面共享的。一般情況下,我們會在_layout中引用公共的js類別函式庫,例如jQuery,bootstrap等,這樣的話其他的頁面就不需要對這些類別庫再引用一遍,提高了編碼的效率。然而,不同的頁面終究會依賴不同的js,尤其是實現頁面本身功能的自訂的js,這樣我們就必須在其他頁面中再引用特殊的js,甚至將js直接寫在頁面中,例如下面的程式碼常會出現在View:

<script type="text/javascript">
 $(function(){...});
</script>
登入後複製

這樣會導致頁面比較混亂,而且頁面

熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板