如何为requirejs编写lodash模板加载器

如何为requirejs编写lodash模板加载器,requirejs,underscore.js,lodash,Requirejs,Underscore.js,Lodash,我正在使用requirejs插件定义“tmpl!”加载程序(不是jquery模板,而是lodash模板。问题是文本!加载程序在模板末尾添加了一个“;”。这正在呈现并破坏一切 (function(global){ "use strict"; define({ load : function(name, require, load, config) { var deps = []; deps.push('text!' + name); deps

我正在使用requirejs插件定义“tmpl!”加载程序(不是jquery模板,而是lodash模板。问题是文本!加载程序在模板末尾添加了一个“;”。这正在呈现并破坏一切

(function(global){
  "use strict";
  define({
    load : function(name, require, load, config) {

      var deps = [];

      deps.push('text!' + name);
      deps.push('underscore');

      require(deps, function(source, _) {
        var template = _.template(source);
        load(template);
      });
    }
  });
})(this);

如何阻止text!添加分号?或者:有更好的方法吗?

按相反顺序回答问题:

有更好的方法吗

似乎是这样的,你可能想考虑使用它而不是自己编写。虽然简单的情况是少量的代码,但是有一堆你可能最终需要的R.JS优化器相关的东西。 但是关于您的实现逻辑,我注意到它没有使用text!plugin,而是在load()方法中使用自己的XHR。这没有解释,但他给出了一些。注意:这个链接来自于对该方法的其他一些很好的讨论

如何阻止text!添加分号

我尝试了你的插件,但没有添加任何分号。也许你可以发布更多的示例项目和模板?下面是我的,为了简单起见,所有内容都放在一个平面文件夹中:

require.js:来自RequireJS网站的最新版本

domReady.js:来自RequireJS网站的最新版本

text.js:来自RequireJS网站的最新版本

lodash.js:来自lodash网站的最新信息

tmpl.js:问题中的示例加载程序

index.html:

<!DOCTYPE html>
<html>
<head>
    <script src='require.js'></script>
    <script>
    requirejs.config({
        map: {
            '*': { 'underscore': 'lodash' }
        }
    });
    require( [ 'underscore', 'tmpl!friend-template.htm', 'domReady!' ]
        , function( _, friendTemplate ){

        var friendsData = [{ name: 'Bob', age: 35 }, { name: 'Fred', age: 38 }];
        document.body.innerHTML = friendTemplate( {friends: friendsData});
    });
    </script>
</head>
<body>
    <!-- To be populated dynamically. -->
</body>
</html>

requirejs.config({
地图:{
“*”:{“下划线”:“lodash”}
}
});
需要(['下划线','tmpl!friend template.htm','domReady!']
,函数(\ u0,friendTemplate){
var-friendsData=[{name:'Bob',年龄:35},{name:'Fred',年龄:38}];
document.body.innerHTML=friendTemplate({friends:friendsData});
});
朋友模板.htm

<ul>
    <% _.forEach(friends, function(friend) { %>
    <li>
        <span><%- friend.name %></span>
        <span>( Age: <span class="value"><%- friend.age %></span> )</span>
    </li>
    <% }); %>
</ul>
  • (年龄:)

我专门为Lo Dash创建了一个加载程序,您可以在这里看到:

注意:我没有单元测试或保证没有bug,但从我的初始测试来看,它工作得非常好

这在许多方面都比requirejs tpl要好,后者在自己的实现中烘焙,而该实现没有公开。它还需要文件扩展名和硬编码路径。这两个都可以在我的代码中配置

编辑:我发布了一个名为
lodash模板加载器
的项目,该项目具有测试功能