Skip to content


Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?

Latest commit


Git stats


Failed to load latest commit information.
Latest commit message
Commit time


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.


Exposes `JadeView` and `JadeConventionView` ViewStrategy classes for Aurelia







No releases published


No packages published