brunch / jade-brunch

Adds Jade support to Brunch

jade-brunch

Adds Jade support to brunch, by compiling templates into dynamic javascript modules and .jade assets into plain HTML.

Usage

Install the plugin via npm with npm install --save-dev jade-brunch.

Or, do manual install:

• Add "jade-brunch": "x.y.z" to package.json of your brunch app. Pick a plugin version that corresponds to your minor (y) brunch version.
• If you want to use git version of plugin, add "jade-brunch": "git+ssh://[email protected]:brunch/jade-brunch.git".

You can also use jade-brunch to compile jade into html. Just place your jade files into app/assets.

Assumptions

When using Jade's basedir relative include and extend, the basedir will be assumed to be 'app' within the Brunch root. See #989

For jade files in app/assets, the basedir will be assumed to be app/assets.

License

The MIT License (MIT)

Copyright (c) 2012-2014 Paul Miller (http://paulmillr.com)

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

jade-brunch's Issues

After updating, jade-brunch throws error re: data being undefined

After updating all of my dependencies to latest (which in hindsight may not have been a good choice), jade-brunch fails during compilation with the error reproduced here:

/home/cody/code/codysehl.net/new/node_modules/jade-brunch/lib/index.js:51
      dependencies = data.split('\n').map(function(line) {
                          ^
TypeError: Cannot call method 'split' of undefined
  at JadeCompiler.module.exports.JadeCompiler.getDependencies (/home/cody/code/codysehl.net/new/node_modules/jade-brunch/lib/index.js:51:27)
  at JadeCompiler.getDependencies (/home/cody/code/codysehl.net/new/node_modules/jade-brunch/lib/index.js:4:61)
  at getDependencies (/usr/local/lib/node_modules/brunch/lib/fs_utils/pipeline.js:40:23)
  at /usr/local/lib/node_modules/brunch/lib/fs_utils/pipeline.js:80:16
  at JadeCompiler.module.exports.JadeCompiler.compile (/home/cody/code/codysehl.net/new/node_modules/jade-brunch/lib/index.js:40:9)
  at /usr/local/lib/node_modules/brunch/lib/fs_utils/pipeline.js:96:31
  at fn (/usr/local/lib/node_modules/brunch/node_modules/async-waterfall/index.js:19:24)
  at Object._onImmediate (/usr/local/lib/node_modules/brunch/node_modules/async-waterfall/index.js:58:22)
  at processImmediate [as _immediateCallback] (timers.js:330:15)

This error occurs while running brunch build or brunch watch -s.
I have successfully compiled my project using just the jade command, I'm confident my .jade files do not contain any errors.

Edit: I've made sure my brunch package is at latest. I've tried rolling back to previous versions of jade-brunch, but receive the same error, which would leave me to believe it's not the fault of jade-brunch, though I don't know what else to troubleshoot.

jade indent problems on angularjs partials jade files

I get this error:

unexpected token "indent" ; Compiling of 'app/partials/component_dialog.jade' failed.     app/partials/component_dialog.jade:9
    7| .modal-footer
    8|     input.btn.btn-primary(type="submit", value="Done", ng-click="submit()")
 > 9|

component_dialog.jade:
.modal-header
h1 Select a Component
.modal-body
.row-fluid
input(type="text", ng-model="searchText", class="search-query", placeholder="Search")
ng-include(src="'/static/partials/component_view.html'")
.modal-footer
input.btn.btn-primary(type="submit", value="Done", ng-click="submit()")

package.json:
"jade-brunch": "git+ssh://[email protected]:brunch/jade-brunch.git",
"jade-angularjs-brunch": ">= 0.0.1 < 1.5",

if I launch:
./../node_modules/.bin/jade component_dialog.jade

rendered component_dialog.html

no problems.

Describe what this plugin actually does in the readme

Currently the description is "Adds Jade support to brunch". Which I would take to mean "if you put a .jade file in the app dir, it will be transformed to .html in public."

I gather it actually transforms Jade files into some sort of JS template object. That's fine, but you should describe it in the README. This is very confusing for a new user of Brunch.

Updated jade-brunch to 1.7.3 (from 1.5.1) and can no longer use underscore from jade templates

I've been updating some of my dependencies, including brunch and its packages. After having done so, I'm getting exceptions in my jade templates where I use underscore (e.g., _.keys) as it being undefined. I am guessing that this might be configuration issue, but I'm stumped on where to look. Any help would be greatly appreciated!

Thanks!

TypeError when attempting to build with v2.0.0

I'm getting the following error when attempting to build using jade-brunch v2.0.0:

path.js:8
    throw new TypeError('Path must be a string. Received ' +
    ^

TypeError: Path must be a string. Received false
  at assertPath (path.js:8:11)
  at Object.posix.join (path.js:479:5)
  at relativeToRoot (/usr/lib/node_modules/brunch/lib/deppack.js:50:55)
  at /usr/lib/node_modules/brunch/lib/deppack.js:65:40
  at Array.reduce (native)
  at Object.keys.filter.reduce (/usr/lib/node_modules/brunch/lib/deppack.js:63:53)
  at getNewHeader (/usr/lib/node_modules/brunch/lib/deppack.js:86:17)
  at generateModule (/usr/lib/node_modules/brunch/lib/deppack.js:102:10)
  at /usr/lib/node_modules/brunch/lib/deppack.js:151:13
  at tryToString (fs.js:414:3)
  at FSReqWrap.readFileAfterClose [as oncomplete] (fs.js:401:12)

I attempted to reinstall using npm install --save-dev jade-brunch@latest as per the comment in #23, but the error remained. Not sure as to what else to try.

package.json:

{
  "author": "@bkuri",
  "dependencies": {},
  "description": "",
  "devDependencies": {
    "auto-reload-brunch": "^2.0.0",
    "clean-css-brunch": "^2.0.0",
    "coffee-script-brunch": "^2.0.0",
    "css-brunch": "^2.0.0",
    "jade-brunch": "^2.0.0",
    "javascript-brunch": "^2.0.0",
    "stylus-brunch": "^2.0.0",
    "uglify-js-brunch": "^2.0.1"
  },
  "engines": {
    "node": "latest"
  },
  "homepage": "",
  "keywords": [
    "brunch",
    "skeleton",
    "coffeescript",
    "jade",
    "stylus",
    "vuejs"
  ],
  "license": "MIT",
  "main": "index.coffee",
  "name": "vue-brunch",
  "repository": {
    "type": "git",
    "url": ""
  },
  "scripts": {
    "start": "brunch w -s",
    "test": "brunch test"
  },
  "version": "0.1.0"
}

brunch-config.coffee:

exports.config =
  files:
    javascripts:
      joinTo:
        'js/app.js': /^app/
        'js/vendor.js': /^vendor/
        'test/js/test.js': /^test(\/|\\)(?!vendor)/
        'test/js/test-vendor.js': /^test(\/|\\)(?=vendor)/

      order:
        before: []

    stylesheets:
      joinTo:
        'css/app.css': /^app/
        'css/vendor.css': /^vendor/
        'test/css/test.css': /^test/

        order:
          after: []
          before: []

    templates:
      joinTo: 'js/templates.js'


  modules:
    nameCleaner: (path) ->
      path = path.replace(/^app\//, '')
      path = path.replace(/^javascripts\//, '')


  npm:
    enabled: yes


  plugins:
    static_jade:
      extension: '.static.jade'

    stylus:
      paths: [ './app/assets/css' ]

Add options to not compile include/extend partials during static compilation.

As of now brunch copies everything from assets directory so every template will be copied.
It would be great to have option to not copy files that are only included. Maybe similarly to the way brunch ignores files for compilation( by default files starting with _) are ignored.

On other hand maybe it would be better to have some means of pre-compilation outside of static compilation?(i.e. when templates ain't in assets folder)

Include / Extends do not compile properly

• include/extend path-finding is in brunch watcher context, instead of browser-context. You notice the difference when using absolute paths. It's confusing to have two scopes.
• jade that are dependent on other jade do not get recompiled.

Reason is that jade inheritance/dependency is static (i.e. hard-coded) as opposed to dynamic (i.e. in the template functions). As soon as you change a parent, the child (using extend) should be recompiled too. Same goes for include: As soon as you change the child, you should recompile the parent (using include) too.

Example setup for these issues:

Run brunch w -s with the following minimal setup

index.html - run the child.jade

$(function() { $('body').html(require('child')())

child.jade

extends parent
block content
  hello, i am a child

parent.jade

h1 Hello World!
block content
   hello, i am the parent

Now change the parent h1. Brunch watches and recompiles, but forgets to recompile the child. Watch the app.js: Inheritence is static (i.e. hard-coded), and not dynamic (i.e. in the template function).

Brunch-jade should either discover dependencies and recompile (but there are some issues with include/extend and path-finding here -- perhaps because of different context: brunch watcher -vs- in the browser?)... or brunch-jade should just always compile all jade (or always compile all jade containing extend/include statements)

Jade is in the process of being renamed to pug

pugjs/pug#2184

Not super urgent right now, but it looks like within the next 6 months jade will be phased out on npm in favor of pug due to some trademark issue.

[feature] allow to pass options to Jade compiler

It would be nice if there would be some way to pass options to Jade compiler. For example, to pass pretty: true option.

what does this brunch do?

I am using Jade with Express.

So when a GET request comes in it compiles the Jade into HTML with the locals I have set and fire it to the browser, in real time.

I can't figure out what this brunch is actually doing in the build process.

jade undefined

Hello.

I'm trying to use Jade and Chaplin with Brunch. I cannot seem to get a simple Jade template working, since jade is not globally defined:

Uncaught ReferenceError: jade is not defined

Here is the offending line of code in my templates.js:

buf.push("<a href="i.href" class="header-link">" + (jade.escape(null == (jade_interp = i.title) ? "" : jade_interp)) + "");

The issue is right at the "jade.escape," since as I said, jade is not globally defined, and is not require'd anywhere in the file. I thought it may be an issue with separating templates to a separate file, but joining to app.js did not resolve the issue - it doesn't require or define jade anywhere either.

Another route I tried to go down is to add jade to the window object in my initialization script:

window.jade = require "jade"

Then, the jade object IS globally defined, but I get issues with __filename not being defined. I assume this is because the jade version I have is assuming a Browserify environment, whereas Brunch does its own CommonJS wrapping, and doesn't define low-level Node globals like Browserify does.

I then went down a long rabbit-hole of trying to use browserify-brunch, but a) I can't seem to get it to work, and documentation and comments are REAL thin, and b) some comments I have seen indicate that this completely negates the main reason to use Brunch (speed), since Browserify basically takes over the entire build process, not just the CommonJS wrapping - so all files are built on any file update.

Here is the complete Jade template that is having the issue - as I said, it's rather benign:

each i in items
a(class="header-link", href="i.href")=i.title

Here are the versions of all of my dependencies:

"dependencies": {
"chaplin": "^1.1.1",
"jquery": "^2.2.0"
},
"devDependencies": {
"auto-reload-brunch": "^1.8.1",
"clean-css-brunch": "^1.8.0",
"coffee-script-brunch": "^1.8.3",
"jade-brunch": "^1.8.2",
"static-jade-brunch": "^1.8.0",
"stylus-brunch": "^1.8.1",
"uglify-js-brunch": "^1.7.8"
}

One las thought on my part - should I skip using static-jade-brunch? Could that be causing the issue? Something very strange about it is that it seems to create .html versions of all my Jade templates in app/assets during the build process, and leaves them there. Doesn't seem very brunch-like. Is this just a crappy Brunch plugin?

Any help would be much appreciated!

Thanks,

Tim

Jade runtime include does not work with npm 3

Concatenating the path for .include doesn't work anymore with npm 3. This release aggressively flattens the tree, so jade will most likely (but not certainly) be located at __dirname/../jade. You should use require.resolve('jade') instead.

Jade includes from outside of /assets folder

Hello.

When jade includes are in the assets folder - everything works fine.

When they are included from outside of assets folder jade doesn't watch on included files.
Is it possible to tell jade-brunch to watch additional folders?

Project structure:

assets/
    index.jade
components
   component1
      component1.js
      component1.scss
      _component1.jade
   component2
      component2.js
      component2.scss
      _component2.jade

1. I try to include components into index.
2. I don't want to keep my components source files in assets directory, because it is public. And for scalability I want to keep my js, scss and jade files together.
3. When I save any of _componentX.jade, template compilation isn't being triggered. Therefore I need some kind of custom configuration.

upgrade jade dep to 1.0.0

Cannot re-compile after fixing static jade template syntax error

Way to reproduce

1. Use static templates.
2. brunch watch --server
3. Introduce any syntax error in template. //Error is issued by brunch
4. Fix error. -> The same error is issued by brunch(exactly the same output).

Workaround:

Terminate brunch and start again. Everything works fine.

It is unclear how it is possible, but for some reason after fixing error, exactly the same error appears in console(even though template is no longer the same)

I'm unable to use it inside a angular-brunch-seed project

Hi,
I'm trying to use jade-brunch inside angular-brunch-seed but it seems that the compile function of the plugin is never called.
I have "jade-brunch": "*" inside package.json.
My npm ls | grep brunch is:
├─┬ [email protected]
├─┬ [email protected]
├─┬ [email protected]
├─┬ [email protected]
├─┬ [email protected]
├─┬ [email protected]
├─┬ [email protected]
├─┬ [email protected]
├─┬ [email protected]
├─┬ [email protected]
└─┬ [email protected]

I've tried to add a console.log(data) as the first row of compile and a console.log inside the JadeCompiler constructor.
The JadeCompiler is istantiated but seems that compile function is never called.

Can you help me?

Undefined variable

On previous brunch installation i could do something like #{location.host} in jade but now (latest version) brunch will exit and say "Cannot read property 'host' of undefined".

---

node_modules/static-jade-brunch/node_modules/jade/lib/runtime.js:198
throw err;

"jade-brunch": "~1.7.2"

templates:
joinTo: 'javascripts/templates.js': /.+.jade$/

Defining jade option "globals"

Hello,
Regarding your previous opinion on global variables in #13, an option was added to Jade to pass variables to templates (see https://github.com/visionmedia/jade/blob/master/lib/jade.js#L103-L116).

Could it be considered again? #7 might be helpful, would you mind if I try to rebase it and submit the PR again?

Thanks!

Include / extends / mixins do not work

Using include, extends or mixin in a template does not work as expected. Expected behavior is that when template is compiled those pieces will be as well. This is not happening.

Uncaught ReferenceError: require is not defined

Through my brunch config, I am combining vendor js files into a separate file:

module.exports = config:
  files:
    javascripts: joinTo:
      'vendor.js': /^(?!app\/)/
      'app.js': /^app\//

This was working before, for some reason now I am getting Uncaught ReferenceError: require is not defined, which occurs because the node_modules/jade/runtime.js calls require.register('browser-resolve/empty', function(exports,req,module){

I'm not sure how to resolve this? Previously, when using earlier versions of jade-brunch and jade-static-brunch, the npm module for jade wasn't installed into my node_modules directory.

---

My dependencies in package.json:

"devDependencies": {
    "brunch": "^2.4.2",
    "css-brunch": "^2.0.0",
    "javascript-brunch": "^2.0.0",
    "postcss-brunch": "^0.5.0",
    "stylus": "^0.53.0",
    "stylus-brunch": "^2.0.0",
    "auto-reload-brunch": "^1.8.1",
    "jade-brunch": "^2.0.0",
    "static-jade-brunch": "^1.8.0"
  }

Previously working (with older versions):

  "devDependencies": {
    "autoprefixer": "^6.0.3",
    "brunch": "^1.8.5",
    "css-brunch": "^1.7.0",
    "jade-brunch": "^1.8.1",
    "javascript-brunch": "^1.8.0",
    "postcss-brunch": "^0.5.0",
    "sass-brunch": "^1.9.1",
    "static-jade-brunch": "^1.8.0"
  }