瞭解如何使用require js結合文本js在骨幹應用程序中加載html模板

我正在學習骨幹js，試圖製作一個小型項目。瞭解如何使用require js結合文本js在骨幹應用程序中加載html模板

在TE頁面的，我加載require.js和text.js從CloudFlare的CDN

<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.8/require.min.js">//</script> 

<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/require-text/2.0.10/text.js">//</script>

我做了所謂的「盒子」骨幹觀點：

var Boxes = Backbone.View.extend({ 

     // Choose an element. 
     el : '.content', 

     render : function() { 

      // Captur "this" -> the backbone view itself. 
      var that = this; 

      $(this.el).html('how do I load a html template here?'); 

     } 
    });

問題：

當我加入text.js插件的頁面，我得到以下錯誤：

不匹配的匿名定義（）模塊：function（module）{'use strict'; ......

所以我不能有require.js和text.js都加載，它給我上面的錯誤甚至是空白頁上沒有它的任何其他腳本。

當我讓require js與文本js一起工作後，如何爲該視圖加載html模板？

現在我知道如何在index.html頁面內聯我自己的模板時編寫模板。

我不喜歡這樣寫道：

var Boxes = Backbone.View.extend({ 

    el : '.content', 

    render : function() { 

     var that = this; // This backbone view 

     var template = _.template($('#user-list-template').html(), {}); 

     that.$el.html(template); 
    } 
});

謝謝！

來源

2013-10-22 Dany D

在HTML文件中，你只需要加載requrejs想在這個index.html

<script type="text/javascript" data-main="js/main" src="js/libs/require-2.1.2.min.js"></script>

按如上文所示，「數據主要」講述requirejs要加載的啓動文件，在這種情況下，在「js/main.js」下面

你可以在here找到文件。

在main.js文件，你需要指定

require.config({ ... });

配置requirejs。

後，您可以使用「定義（）/需要（）」來加載類的模板......

define(['text!../../templates/app/content.about.html'],...);

在這裏看到a complete example.

來源

2013-10-22 18:06:17

我很驚訝這種信息在require.js文檔中沒有很清楚地陳述。 – SamHuckaby

看來，文本插件無法從CDN加載。遇到完全相同的問題，不幸的是，文本插件必須在本地託管相對於主腳本。 – cdanea

當您使用require.js時，您只能在頁面中使用一個腳本標記。其他所有內容都由Require.js加載。

使用插件，你會在require.config

require.config({ 
    paths: { 
     text: "path/to/text" 
    } 
});

然後在你的模塊配置它，你只需把它叫做：

define([ 
    "text!path/to/tpl" 
], function(tplString) { 

});

不過請注意，如果你管理模板，最好的方法是加載預編譯的模板。文本插件只返回一個字符串，這對優化並不是很好，並強制您重複模板編譯邏輯。你應該使用模板加載器插件，下劃線/ lodash微模板，我推薦你這個：https://github.com/tbranyen/lodash-template-loader

如果你想要一個使用Require.js和Backbone的應用程序的例子，你應該檢查Backbone-Boilerplate： https://github.com/backbone-boilerplate/backbone-boilerplate

Backbone-Boilerplate是使用圍繞Backbone開發的最佳實踐快速設置項目的好方法。此外，它還廣泛使用AMD，所以如果你是第一次使用它，你將擁有一個工作環境。

來源

2013-10-22 18:02:02

你的答案是混亂。你是否建議應該使用模板來使用插件文本？ –

文本插件是模板插件的要求，但使用模板插件通常「更好」，因爲它可以緩存編譯的模板以供重用，而不是每次都從一個字符串重新編譯。 – mix3d

瞭解如何使用require js結合文本js在骨幹應用程序中加載html模板

回答

相關問題