Skip to content
This repository has been archived by the owner on Nov 28, 2018. It is now read-only.

asavoy/requirejs-canjs-templates

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

31 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

requirejs-canjs-templates

A RequireJS plugin to load CanJS 2.2 templates.

Features

  • Supports EJS, Mustache and Stache templates as featured in CanJS 2.2.

  • Supports development and production builds.

  • Supports loading with RequireJS, for example, define(["stache!template.stache"], function(template) { ... }).

  • Also supports loading templates with can.view("template.stache"), and Mustache-style partials with {{>template.stache}}. Just make sure they are loaded by RequireJS first with, for example,
    define(["stache!template.stache", ...]).

  • Stache templates are pre-compiled for the production build, and dependencies loaded first when using <can-import from="some-project/some-component" />.

  • EJS and Mustache templates are not currently pre-compiled.

Installation

Install with NPM:

npm install requirejs-canjs-templates --save

Or, install with Bower:

bower install requirejs-canjs-templates --save

You'll also need the text RequireJS plugin:

bower install text --save

To install the Stache template plugin, update your RequireJS config with:

require.config({
    // For the shorter plugin prefix (e.g. `stache!file.stache`).
    paths: {
        stache: "path/to/requirejs-canjs-templates/stache",
        text: "path/to/text/text"
    },
    // So that the template library is included in the build. You don't need 
    // this if you explicitly load the template library elsewhere in your app. 
    shim: {
        "path/to/requirejs-canjs-templates/stache": ["can/view/stache"]
    }
});

To install all template plugins, update your RequireJS config with:

require.config({
    // For the shorter plugin prefix (e.g. `stache!file.stache`).
    paths: {
        ejs: "path/to/requirejs-canjs-templates/ejs",
        mustache: "path/to/requirejs-canjs-templates/mustache",
        stache: "path/to/requirejs-canjs-templates/stache",
        text: "path/to/text/text"
    },
    // So that the template library is included in the build. You don't need
    // this if you explicitly load the template library elsewhere in your app.
    shim: {
        "path/to/requirejs-canjs-templates/ejs": ["can/view/ejs"],
        "path/to/requirejs-canjs-templates/mustache": ["can/view/mustache"],
        "path/to/requirejs-canjs-templates/stache": ["can/view/stache"]
    }
});

Load your templates:

define(["stache!./hello.stache"], function(helloTemplate) {
    document.body.appendChild(helloTemplate({}));
});

For further integration examples, see https://github.com/asavoy/requirejs-canjs-project.

Changelog

0.3.0

Thanks to @lastzero:

  • Fixed compatibility with Bower.
  • Fixed Stache template loader by removing debugging code.

0.2.0

  • Added support for in CanJS 2.2 Stache templates.
  • Now pre-compiles Stache templates to avoid parsing step in production.
  • Now requires CanJS 2.2+.

0.1.0

  • Initial version.

License

Released under the MIT license.