Grunt jade compiler filling out empty attributes

Question

I'm using the grunt-contrib-jade module to compile my Jade templates, if I leave my attribute blank like the following line:

article(ui-view)

It will compile to:

<article ui-view="ui-view"></article>

And that will break my AngularJS ui-router, as it will not handle the "ui-view" directive as if it is a named view (not what I want). Of course it's an option to write my jade file like this:

article(ui-view='')

But that's not what I want, is there some way to stop the jade compiler from filling out empty attributes?

Answer 1

Everything seems good when there's doctype html at the beginning of the .jade file.

For partials that does not have doctype, it can also be solved by passing {doctype: 'html'} as option when calling Jade:

jade -O "{doctype:'html'}" partial.jade

It works for grunt-contrib-jade too by adding doctype: 'html' to the options, like so:

jade: {
  devel: {
    options: {
      pretty: true,
      doctype: 'html'
    },
    files: [{
      expand: true,
      cwd: 'src',
      src: [ '**/*.jade' ],
      dest: 'app',
      ext: '.html'
    }]
  }
}

Answer 2

Use pure html in your jade: <div ui-view></div>