Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
163 changes: 62 additions & 101 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,107 +1,12 @@
jade-angularjs-brunch [![Build Status](https://travis-ci.org/GulinSS/jade-angularjs-brunch.png?branch=master)](https://travis-ci.org/GulinSS/jade-angularjs-brunch)
=====================

Compiler Jade templates to AngularJS modules for Brunch.IO with automatic section detection based on location of index.jade's.
DEPRECATED! Need update!
========================

## Step by step using guide
Automatic compiler Jade templates to AngularJS modules for Brunch.IO

For example you have a directory structure of your project such as:

```
app/
index.jade
application.coffee
welcome/
page.jade
page.less
controllers.coffee
directives.coffee
otherStuff.coffee
access/
index.jade
application.coffee
register/
page.jade
page.less
controllers.coffee
directives.coffee
otherStuff.coffee
login/
...
admin/
index.jade
application.coffee
users/
...
records/
...
landing/
index.jade
...

```

The key note of example above is location of index.jade's. Them will be compile as usual jade files into index.html's. Your public folder will have such structure:

```
_public/
index.html
access/
index.html
admin/
index.html
landing/
index.html

```

And as addition it will group "partials" (files like page.jade in example) of this section into javascript files:

```
_public/
js/
app.templates.js # it will contains compiled content of
# app/welcome/page.jade and any jades in subdirectories

app.access.templates.js # it will contains compiled content of
# app/access/register/page.jade and
# app/access/login/page.jade
# and any jades in subdirectories

app.admin.templates.js # ...
...
```

Any file in example above will contains declaration of Angular.js module with same name:

```
app.templates.js -> app.templates
app.access.templates.js -> app.access.templates
...
```

Modules must be registered in application.coffee's files such as:

```
App = angular.module('app', [
...

'app.templates'
])
```

After action above you can use your template in your code like this:

```
$routeProvider
.when('/welcome', {templateUrl: 'app/welcome/page.jade'})
```

or in directive's templateUrl.

This magic helps you split your large application on small SPA sections for improving performance and control complexity.

## Sample of settings (DEPRECATED)
## Sample of settings:

### Add to dependencies section in package.json of your project:

Expand Down Expand Up @@ -146,15 +51,71 @@ angular.module('login.templates', [])
'This is content of your jade-file',''].join("\n"));
}])
```
# Specific Output Directory

You can now specify the output directory of the compiled files using the `output_directory` property of the config
```coffee
plugins:
plugins:
jade_angular:
output_directory: 'foo'
```


# Angular Module Config

You can add an angular module namespace to all templates using the `angular_module` property.

```coffee
jade_angular:
single_file: false
angular_module
namespace: 'myLibrary'
predefined: false
```
This will create template files with namespaced modules instead of using directory structure.

```javascript
angular.module('myLibrary.templates', [])
.run([ '$templateCache', function($templateCache) {
return $templateCache.put('myLibrary/templates/hello.html', [
'',
'<div>',
' <h1>Hello, World!</h1>',
'</div>',''].join("\n"));
}]);
```

You can also specify whether or not the angular module has been predfined using the `predefined` property

```coffee
jade_angular:
single_file: false
angular_module
namespace: 'myLibrary'
predefined: true
```

```javascript
angular.module('myLibrary.templates')
.run([ '$templateCache', function($templateCache) {
return $templateCache.put('myLibrary/templates/hello.html', [
'',
'<div>',
' <h1>Hello, World!</h1>',
'</div>',''].join("\n"));
}]);
```


# Single-File Mode

If you want a single file instead of a file per module, you can use the `single_file` option in `jade_angular`.

```coffee
plugins:
jade_angular:
single_file: true
jade_angular: single_file: true
# if you want to change the file name (defaults to js/templates.js and is in your public directory)
single_file_name: 'js/angular_templates.js'

```
Loading