Question

I use the text plugin of require.js to include some html templates as follows:

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,
        ...
    }
});

I really have no need to retain references to each template (even though I am doing so right now); I really just need to dump all of the templates into my head.

This way of doing things is cumbersome because it requires me, no pun intended, to add a reference for every new template html file.

What I would like to do is something like this:

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

Is it possible to do this? And if so, what is the syntax for including and stringing all the included files together as one big reference?

Était-ce utile?

La solution

RequireJS doesn't support this because it's not (always) possible to get a directory listing from a remote server. What you want is a build tool like Grunt.

For example, with the grunt-contrib-concat task, you could use this configuration to concat all your templates to a single file (that you then include using RequireJS):

concat: {
    templates: {
      src: ['assets/templates/*'],
      dest: 'templates.html'
    }
}
Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top