Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Implemented compilation for client:true and added wrappers for AMD and JST #14

Closed
wants to merge 5 commits into from

Conversation

mereskin-zz
Copy link

It is sometimes desired to use Jade templates client-side, e.g. in Backbone apps. Jade compiler supports "client: true" mode, which produces javascript function, which can be called client side.

To use jade templates client-side you have to change extension to .js, and add one of the wrappers: amd or jst. AMD wrapper will create AMD-compatible module in the specified destination file to be used with require.js.

jade: {
  files: {
    'tmp/jst/jade.js': ['test/fixtures/jade.jade']
  },
  options: {
    client: true,
    wrapper: "amd"
  }
}  

JST wrapper will extend global JST object with template function. Template name can be processed with processName(srcFile). Compiled template then can be rendered simply by calling window.JST["templateName"](data):

jade: {
  files: {
    'tmp/jst/jade.js': ['test/fixtures/jade.jade']
  },
  options: {
    client: true,
    wrapper: "jst",
    processName: function(str) { return str.match(/^test\/fixtures\/(.*)\.jade$/)[1]; },
  }
}  

@tkellen
Copy link
Member

tkellen commented Feb 8, 2013

Hey Andrey,

Thanks for taking the time to submit this PR, it looks really nice! We have added this to another of the contrib-series tasks already and I'd like to keep it consistent--could you please see gruntjs/grunt-contrib-handlebars#24 for our preferred implementation?

Also, we won't be supporting RequireJS within any of the templating tasks themselves, as you can perform the optimization using grunt-contrib-requirejs. You can even do it in one step after configuring an alias task, if you like.

@mereskin-zz
Copy link
Author

Ok, Tyler, I will check it out.

@tkellen
Copy link
Member

tkellen commented Feb 20, 2013

@andreym Have you had a chance to check out the handlebars task?

@mereskin-zz
Copy link
Author

Yes! Sorry, I was overloaded by the work. Will submit changes tomorrow.

@tkellen
Copy link
Member

tkellen commented Feb 21, 2013

Awesome, thanks!

@mereskin-zz
Copy link
Author

Here you go!

@tkellen
Copy link
Member

tkellen commented Feb 22, 2013

Hey Andrey, I need to rebase this against the current master, as it is now, merging your PR would require re-writing our history. Otherwise, I think this looks good!

@jessedijkstra
Copy link

Exactly what I was looking for! Been missing this since I switched from grunt-jade to grunt-contrib-jade. Any ETA when this will be merged in and put on NPM?

@tkellen
Copy link
Member

tkellen commented Mar 6, 2013

ping @mereskin

@gvn
Copy link
Contributor

gvn commented Mar 7, 2013

Bump! +1

@mereskin-zz
Copy link
Author

Completed rebase.

@tkellen tkellen closed this in 732d57e Mar 7, 2013
@tkellen
Copy link
Member

tkellen commented Mar 7, 2013

Added you to AUTHORS and published as 0.5.0. Hugely useful PR, thanks a TON Andrey.

@mereskin-zz
Copy link
Author

You are welcome!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

5 participants