aurelia-jade-viewstrategy's Introduction

aurelia-jade-viewstrategy

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).

Usage

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
			.customElement('page')
			.add( new JadeConventionView() )
	}
};

Dependencies

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.

Ensure that NodeJS is installed. This provides the platform on which the build tooling runs.
From the project folder, execute the following command:
```
npm install
```
Ensure that Gulp is installed. If you need to install it, use the following command:
```
npm install -g gulp
```
To build the code, you can now run:
```
gulp build
```
You will find the compiled code in the dist folder, available in three module formats: AMD, CommonJS and ES6.
See gulpfile.js for other tasks related to generating the docs and linting.

aurelia-jade-viewstrategy's People

Contributors

Stargazers

Watchers

aurelia-jade-viewstrategy's Issues

How do I setup my environment to precompile jade files to .js?

Would be nice with some instructions on how to prepare environment for using Jade with Aurelia :)
I guess I have to use https://www.npmjs.com/package/gulp-jade somehow?
Thanks!