Aurelia and Meteor power combined.Use typescript and Jade to speed up your works.
This package forked from aurelia-meteor. I add Jade support and html-minify.
This package dependent on SystemJS Module loader. It's already combind meteor-typescript as dependence. But if you want a typescript support in your apps, you need install meteor-typescript package.
- Install Meteor
$ curl https://install.meteor.com | /bin/sh - Create a new meteor app using
$ meteor create myappor navigate to the root of your existing app - Install Aurelia and meteor-typescript:
$ meteor add tsumina:meteor-aurelia`
$ meteor add tsumina:meteor-typescript` # if you need typescript support- Example application : A meteor-aurelia port of skeleton-navigation
Aurelia use conventions to keep code simple and clean, to bootstrap a aurelia app you need a index.html (the root of an Meteor app), include:
<body>
<div aurelia-app="client/main"></div>
<script>
System.import('aurelia-bootstrapper');
</script>
</body>The aurelia-app="client/main" attribute points to the Aurelia configuration file named main, which is main.au.js or main.ts.
Assume you use es6 js and html template. In the client folder create main.au.js and insert:
export function configure(aurelia) {
aurelia.use
.standardConfiguration()
.developmentLogging();
aurelia.start().then(a => a.setRoot('client/app'));
}The main.au.js is the file where the configuration is done to bootstrap Aurelia.
In this case the main file tells where the entry point of the app is located ('client/app'), which means go look for the app.au.html, app.au.js pair.
By convention Aurelia uses view/view-model pairs of the same name.
In the client folder, create app.au.html and insert:
<template>
<input type="text" placeholder="Your name" value.bind="name">
<h2>Hello ${name}!</h2>
</template>Then create app.au.js and insert:
export class App {
constructor(){
this.name = "";
}
}Infact, if you add meteor-typescript to your app, now you can use SystemJS Module loader on both client/server. Simple write like this(the root of an Meteor app):
index.html
<body>
<div aurelia-app="client/main"></div>
</body>entry.js
if (Meteor.isClient) {
Meteor.startup(function(){
System.import('aurelia-bootstrapper');
})
}
if (Meteor.isServer) {
Meteor.startup(function(){
// some codes
})
}- Use
.au.jsor.tsfor every javascript file that Aurelia will handle. - Use
.au.htmlor.jadefor every Aurelia Templates.
You can mix these things as your wish.
Code and documentation © 2015 TsumiNa Released under the MIT license.