定义requires模块,包括文件夹中的所有文件

Define requirejs module including all files in folder

本文关键字:文件 文件夹 requires 模块 包括 定义      更新时间:2023-09-26

我使用require.jstext插件包含一些html模板,如下:

define([
    'text!/assets/templates/home/myApp.templates.home.home-pane.html',
    'text!/assets/templates/nav/myApp.templates.nav.top-navbar.html',
    'text!/assets/templates/shared/myApp.templates.shared.layout.html',
    ...
], function (HomeTmpl, TopNavbarTmpl, SharedLayoutTmpl, RegisterVerticalTmpl, LoginVerticalTmpl, ThingListItemTmpl, ThingSearchTmpl, TestTestTmpl) {
    var allHtml = function () {
        return HomeTmpl + TopNavbarTmpl + SharedLayoutTmpl + RegisterVerticalTmpl + LoginVerticalTmpl + ThingListItemTmpl + ThingSearchTmpl + TestTestTmpl;
    }
    return {
        All: allHtml,
        HomeTmpl: HomeTmpl,
        TopNavbarTmpl: TopNavbarTmpl,
        ...
    }
});

我真的不需要保留对每个模板的引用(即使我现在正在这样做);我真的只需要把所有的模板转储到我的head中。

这样做很麻烦,因为它需要我,没有双关语的意思,为每个新的模板html文件添加一个引用。

我想做的是这样的:

define(['text!/assets/templates/*'], function(Templates) { return Templates; });

这是可能的吗?如果是这样,包含所有包含的文件并将它们串在一起作为一个大引用的语法是什么?

RequireJS不支持这一点,因为它(总是)不可能从远程服务器获取目录列表。你需要的是像Grunt这样的构建工具。

例如,对于grunt-contrib-concat任务,您可以使用此配置将所有模板连接到单个文件(然后使用RequireJS包含该文件):
concat: {
    templates: {
      src: ['assets/templates/*'],
      dest: 'templates.html'
    }
}