Exposes `JadeView` and `JadeConventionView` ViewStrategy classes for Aurelia
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.



This library is an addon to the Aurelia platform and provides JadeView and JadeConventionView ViewStrategy classes which will allow you to utilise .jade and .jade.js compiled files easily, along with the SystemJS jade plugin (installed as dependency).


To utilise this ViewStrategy, override the getViewStrategy on your ViewModel. Here's an example using JadeConventionView:

import {JadeConventionView} from 'aurelia-jade-viewstrategy';

class ViewModel {
	getViewStrategy() {
		return new JadeConventionView();

If you don't want to retrieve the view by convention, but rather using a defined URL, use JadeView instead:

import {JadeView} from 'aurelia-jade-viewstrategy';

class ViewModel {
	getViewStrategy() {
		return new JadeView('./template.jade');

Finally, if you are using pre-compiled jade.js files (i.e. you've pre-compiled the .jade files into their associated template functions) and want to use those instead, you can tell the instance not to use the SystemJS loader and instead load the view as a pure JS module using the isCompiled flag.

import {JadeView} from 'aurelia-jade-viewstrategy';

class ViewModel {
	getViewStrategy() {
		// JadeView example
		return new JadeView('./template.jade', true);
		// ...or with JadeConventionView
		return new JadeConventionView(true);

You can also utilise it with CustomElements by registering the ViewStrategy instance as Metadata:

import {JadeConventionView} from 'aurelia-jade-viewstrategy';

export default class PageCustomElement {
	static metadata() {
		return Behavior
			.add( new JadeConventionView() )


Platform Support

This library can be used in the browser as well as on the server.

Building The Code

To build the code, follow these steps.

  1. Ensure that NodeJS is installed. This provides the platform on which the build tooling runs.

  2. From the project folder, execute the following command:

    npm install
  3. Ensure that Gulp is installed. If you need to install it, use the following command:

    npm install -g gulp
  4. To build the code, you can now run:

    gulp build
  5. You will find the compiled code in the dist folder, available in three module formats: AMD, CommonJS and ES6.

  6. See gulpfile.js for other tasks related to generating the docs and linting.