dgeb / grunt-ember-templates Goto Github PK
View Code? Open in Web Editor NEWA Grunt plugin that precompiles Handlebars templates for Ember.js
License: MIT License
A Grunt plugin that precompiles Handlebars templates for Ember.js
License: MIT License
Console output:
Error: no global:
self
orglobal
found
Ember 2.0.0
EmberData: 2.0.0
Handlebars: 3.0.3 (tried with 2.0.0 also)
Is there any progress on the alpha version? I'm still using this grunt lib to render my templates for a non-cli ember project, i'd like to know if this lib keeps available.
EDIT: I should have asked this question to the ember-template-compiler project I guess...
I tried this
ember_templates:
files: grunt.file.expandMapping(["**/*.tmpl"], "public/",
cwd: "app/"
rename: (destBase, destPath) -> destBase + (destPath.replace /\.tmpl$/, ".tmpl.js")
)
which results in
Warning: Object #<Object> has no method 'indexOf' Use --force to continue.
Is there another way to specify a whole directory to be converted recursively, each file individually?
Do you want the grunt-ember name? grunt-ember is not really maintained and I'd be happy to give it away
➜ grunt ember_templates
path.existsSync is now called `fs.existsSync`.
Running "ember_templates:compile" (ember_templates) task
TypeError: Object #<Object> has no method 'options'
at Object.module.exports (/home/test/projects/test/node_modules/grunt-ember-templates/tasks/ember_templates.js:23:24)
at Object.task.registerMultiTask.task._tasks.(anonymous function).multi (/usr/lib/node_modules/grunt/lib/grunt/task.js:103:15)
➜ npm list grunt-cli -g
/usr/local/lib
└── [email protected]
➜ node -v
v0.8.16
➜ npm -v
1.1.69
➜ npm list
└── [email protected]
Hello,
Since Ember.js 1.9, when using the templateCompilerPath
and handlebarsPath
options, this task fails with the following error:
>> ReferenceError: module is not defined
Warning: Ember Handlebars failed to compile templates/dummy_template.hbs. Use --force to continue.
It works fine though with the latest changes in the master, even with Ember.js 1.10.
Is a new release to NPM planned soon?
Thanks.
I specify multiple files in the task... while compiling and merging the templates... it doesn't flushes out the previous compiled templates from the 'templates' and 'output' array.
E.g.
ember_templates: {
compile: {
options: {
templateName: function(sourceFile) {
return sourceFile.replace(/path/to//, '');
}
},
files: {
"path/to/result.js": "path/to/source.handlebars",
"path/to/another.js": ["path/to/sources/.handlebars", "path/to/more/.handlebars"]
}
}
}
In this case... I get two files created result.js and another.js, which is correct... the issue is in another.js, it consists of the compiled templates from previous path (result.js = sources.handlebars) + ["path/to/sources/.handlebars", "path/to/more/.handlebars"]... ideally it should contains the compiled templates of only ["path/to/sources/.handlebars", "path/to/more/.handlebars"].
Please fix this.
Nice work on this one :)
grunt-contrib is a collection of officially supported grunt plugins, by using the contrib name you're making users believe that is the fact.
I would like to see this either be accepted as an official contrib plugin and moved to the gruntjs org or renamed to something else than grunt-contrib-*.
@tkellen Thoughts?
As per documentation, value in key-value object map for files
within the compile
configuration, is supposed to accept minimatch.
Current results:
Input:
files: {
'app/scripts/templates.js': 'app/scripts/**/*.handlebars'
}
Output:
$ yeoman ember_templates
Running "ember_templates:compile" (ember_templates) task
<WARN> Object app/scripts/**/*.handlebars has no method 'forEach' Use --force to continue. </WARN>
And for input:
files: {
'app/scripts/templates.js': ['app/scripts/**/*.handlebars']
}
It outputs:
$ yeoman ember_templates
Running "ember_templates:compile" (ember_templates) task
>> Error: Unable to read "app/scripts/**/*.handlebars" file (Error code: ENOENT).
<WARN> Ember Handlebars failed to compile app/scripts/**/*.handlebars. Use --force to continue. </WARN>
What configuration should I use to convert all my *.handlebars to template.js single file?
EDIT: I've tried using the exact same code at Gruntfile.js at https://github.com/dgeb/yeoman-ember-basic-example with no success, same error.
I've got a config that looks like this:
ember_templates: {
compile: {
options: {
templateName: function(sourceFile) {
return sourceFile.replace(/src\/Lararjouren\/[a-z]+\/Resources\/templates\//i, '');
}
},
files: {
"src/Lararjouren/ArticleBundle/Resources/public/js/templates.js": "src/Lararjouren/ArticleBundle/Resources/templates/*.hbs",
"src/Lararjouren/UserBundle/Resources/public/js/templates.js": "src/Lararjouren/UserBundle/Resources/templates/*.hbs"
}
}
}
When templates.js
in UserBundle is created (the second entry in files
hash) it contains all the templates from both bundles. Is this by design or a bug?
Is there any way to compile just the matching .hbs
files into a template.js file?
Hey
(I am using yeoman 0.9.6 and grunt-ember-templates 0.4.1)
I have two templates in my app/scripts/templates. Now, when I specify files like
ember_templates: {
compile: {
options: {
templateName: function(sourceFile) {
return sourceFile.replace(/app\/scripts\/templates\//, '');
}
},
files: {
'app/scripts/templates.js': ["app/scripts/templates/**/*.hbs"]
}
}
}
I am getting this error
Error: Unable to read "app/scripts/templates/**/*.hbs" file (Error code: ENOENT).
<WARN> Ember Handlebars failed to compile app/scripts/templates/**/*.hbs. Use --force to continue. </WARN>
however, when I manually specify the files, like below, everything works out fine.
ember_templates: {
compile: {
options: {
templateName: function(sourceFile) {
return sourceFile.replace(/app\/scripts\/templates\//, '');
}
},
files: {
'app/scripts/templates.js': ["app/scripts/templates/application.hbs",
"app/scripts/templates/header.hbs"]
}
}
}
any ideas?
We are relying heavily on ember components. Initially we had all our hbs templates associated with components written within "templates/components" folder, but since the number of components are growing we wanted to give more structure and define the templates within subfolder within components folder. When doing so, ember complains
You are looking for a [XYZ] component in the [SUBFOLDER] namespace, but the namespace could not be found
My compiled template looks like:
Ember.TEMPLATES["components/answers/checkbox-answer"] = ...
But things work if I were to make following change :
Ember.TEMPLATES["components/checkbox-answer"] = ...
The work around I have now is to modify gruntfile like this
emberTemplates: {
options: {
templateName: function(sourceFile) {
var fileName = sourceFile.replace(/.*\/templates\//, '');
if((/^components\//).test(fileName)){
/*if component hbs files are defined within sub-folder, remove the subfolder part*/
return "components"+fileName.substr(fileName.lastIndexOf('/'));
}
return sourceFile.replace(/.*\/templates\//, '');
}
}
I am not sure if this is an ember thing or something else. But putting the question out there hoping for some better solution.
UPDATE
It seems like the problem is caused because of the way we were loading components. We are basically using helper function that loads the component based on parameter we pass to it like :
Ember.Handlebars.helpers[componentToLoad].call(this, options);
I checked the Ember.Handlebars.helpers and it doesn't seem to have components that were defined within any folder within component(but only those defined in components folder).
When upgrading my Ember instance to 1.9.1 which I run within Yeoman, I noticed that the ember-template-compiler is on version 1.8.0 while grunt-ember-templates' package.json expects 1.9.0-alpha, e.g.:
"devDependencies": {
...
"ember-template-compiler": "~1.9.0-alpha"
},
I don't know why the compiler went from 1.9 to 1.8, but my npm installer doesn't like the conflict.
Bryan
Hi Dan, is there a reason you're holding off Handlebars 1.0.0?
I'd like to upgrade to 1.0.0 but ember-templates is forcing the use of COMPILER_REVISION 3.
Thanks!
Disclaimer: I'm new to Ember.js
First off. Thank you. Grunt-ember-templates is great.
I'm using grunt-ember-templates on a phonegap/cordova project, where animated transitions are a must. I just tried to use https://github.com/billysbilling/ember-animated-outlet (while it is appears to use the older linkTo rather than link-to which should be getting updated soon). But during the template compilation phase, I receive an error:
Error: linkToAnimated doesn't match link-to
Would it be possible to either 1) all compilation with a linkToAnimated or better 2) pass an options hash with a custom link-to name?
I have two "base" directories for my templates (one in app and one is a set of copied vendor templates present in tmp/transpiled/templates) ...How to I indicate multiple base paths?
templateBasePath: /app/|/tmp/transpiled/app/templates//,
I noticed there's already an existing doing this https://github.com/yaymukund/grunt-ember-handlebars
What's the reason for creating a new project instead of improving the existing one?
The explanation to that needs to be in the readme, since users will be confused by which to use.
Probably need to coordinate with dependent libraries, but an upgrade to current handlebars would be great.
Update the compiler to use handlebars 1.3 :) Thanks!
Peer [email protected] wants handlebars@~1.1
For partial like post/_edit
how should I name the hbs file?
FYI: we're changing the name of grunt-contrib-lib to grunt-lib-contrib. Please update your deps!
Just wondering: I'm using each
a lot and I've seen in /lib/ember-template-compiler.js
that it is not inside the knownHelpers
:
var options = {
knownHelpers: {
action: true,
unbound: true,
bindAttr: true,
template: true,
view: true,
_triageMustache: true
},
data: true,
stringParams: true
};
Could it be that it could improve the performance of my application?
Please update to use handlebars 2.0.0 :)
Thanks 👍
Can we get an option to compress the templates before they are stuffed into a string? This way, it gets rid of all the leading tabs/spaces leading up to the actual content. I realize some wouldn't want this feature, but I'm very interested in reducing our HTML footprint.
It will be nice to have emblem support
grunt-contrib-watch is a bit slow and when compared to grunt-este-watch it is really slow. I got other grunt-contrib-* scripts working but I couldn't get grunt-ember-templates to work. It might be configuration issue but I tried and I failed. Could someone kindly have a look and advise on how to get it working ... thanks
this.merge does not exist in the compiled template closures.
Ember.TEMPLATES["application"] = Ember.Handlebars.template(function anonymous(Handlebars,depth0,helpers,partials,data) {
this.compilerInfo = [4,'>= 1.0.0'];
helpers = this.merge(helpers, Ember.Handlebars.helpers); data = data || {};
var buffer = '', stack1, hashTypes, hashContexts, options, helperMissing=helpers.helperMissing, escapeExpression=this.escapeExpression;
data.buffer.push("<div class=\"application\">\n <div class=\"content\">\n ");
hashTypes = {};
hashContexts = {};
options = {hash:{},contexts:[depth0],types:["ID"],hashContexts:hashContexts,hashTypes:hashTypes,data:data};
data.buffer.push(escapeExpression(((stack1 = helpers.outlet || depth0.outlet),stack1 ? stack1.call(depth0, "content", options) : helperMissing.call(depth0, "outlet", "content", options))));
data.buffer.push("\n </div>\n</div>");
return buffer;
});
I'm posting this issue to let you know that we will be publishing Grunt 0.4 on Monday, February 18th.
If your plugin is not already Grunt 0.4 compatible, would you please consider updating it? For an overview of what's changed, please see our migration guide.
If you'd like to develop against the final version of Grunt before Monday, please specify "grunt": "0.4.0rc8"
as a devDependency in your project. After Monday's release, you'll be able to use "grunt": "~0.4.0"
to actually publish your plugin. If you depend on any plugins from the grunt-contrib series, please see our list of release candidates for compatible versions. All of these will be updated to final status when Grunt 0.4 is published.
Also, in an effort to reduce duplication of effort and fragmentation in the developer community, could you review the grunt-contrib series of plugins to see if any of your functionality overlaps significantly with them? Grunt-contrib is community maintained with 40+ contributors—we'd love to discuss any additions you'd like to make.
Finally, we're working on a new task format that doesn't depend on Grunt: it's called node-task. Once this is complete, there will be one more conversion, and then we'll never ask you to upgrade your plugins to support our changes again. Until that happens, thanks for bearing with us!
If you have any questions about how to proceed, please respond here, or join us in #grunt on irc.freenode.net.
Thanks, we really appreciate your work!
In case someone runs into the same issue, my templates weren't compiling as I didn't have an ending /
in my path. Not sure if this is the way it's supposed to be or an issue. Feel free to close.
works:
templateBasePath: '<%= yeoman.app %>/scripts/templates/'
does not work:
templateBasePath: '<%= yeoman.app %>/scripts/templates'
Here's the error:
$ grunt
Running "qunit:files" (qunit) task
>> 0 assertions passed (0ms)
Running "ember_templates:default" (ember_templates) task
TypeError: Object #<Object> has no method 'options'
at Object.module.exports (/Users/krainboltgreene/Code/ruby/absolvte/public/node_modules/grunt-ember-templates/tasks/ember_templates.js:25:24)
at Object.task.registerMultiTask.thisTask (/usr/local/share/npm/lib/node_modules/grunt/lib/grunt/task.js:109:15)
at Object.task.registerTask.thisTask.fn (/usr/local/share/npm/lib/node_modules/grunt/lib/grunt/task.js:58:16)
at Task.<anonymous> (/usr/local/share/npm/lib/node_modules/grunt/lib/util/task.js:343:36)
at Task.<anonymous> (/usr/local/share/npm/lib/node_modules/grunt/lib/util/task.js:319:9)
at Task.<anonymous> (/usr/local/share/npm/lib/node_modules/grunt/lib/util/task.js:346:11)
at Task.<anonymous> (/usr/local/share/npm/lib/node_modules/grunt/lib/util/task.js:319:9)
at module.exports.grunt.registerHelper.grunt.utils.spawn.cmd (/usr/local/share/npm/lib/node_modules/grunt/tasks/qunit.js:223:7)
at Object.async.forEachSeries (/usr/local/share/npm/lib/node_modules/grunt/node_modules/async/lib/async.js:104:20)
at Object.module.exports.grunt.registerHelper.grunt.utils.spawn.cmd (/usr/local/share/npm/lib/node_modules/grunt/tasks/qunit.js:130:23)
Here's my grunt.js file:
/*global module:false*/
module.exports = function(grunt) {
// Project Options
var metadata = {
version: '1.0.0',
namespacing: 'var Application = Ember.Application.create();',
banner: '/*! Absolvte Client - v<%= meta.version %> - ' +
'<%= grunt.template.today("yyyy-mm-dd") %>\n' +
'* https://absolvte-client.github.com/\n' +
'* Copyright (c) <%= grunt.template.today("yyyy") %> ' +
'Kurtis Rainbolt-Greene; Licensed MIT */'
}
var templates_options = {
'default': {
options: {
templateName: function(sourceFile) {
return sourceFile.replace(/application\/templates\//, '');
}
},
files: {
"build/templates.js": ["application/templates/**/*.handlebars"]
}
}
}
var concat_options = {
styles: {
src: [
'styles/vendor/bootstrap.css',
'styles/vendor/bootstrap-responsive.css',
'styles/vendor/fontawesome.css',
'styles/styles.css'
],
dest: 'styles.min.css'
},
scripts: {
src: [
'scripts/vendor/bootstrap.js',
'scripts/vendor/modernizr.js',
'scripts/scripts.js'
],
dest: 'build/scripts.js'
},
libraries: {
src: [
'application/libraries/jquery.js',
'application/libraries/sugar.js',
'application/libraries/handlebars.js',
'application/libraries/ember.js',
'application/libraries/ember-data.js'
],
dest: 'build/libraries.js'
},
application: {
src: [
'application/models/model.js',
'application/models/**/*.js',
'application/controllers/controller.js',
'application/controllers/**/*.js',
'application/views/view.js',
'application/views/**/*.js',
'application/routers/router.js',
'application/routers/**/*.js',
'application/application.js'
],
dest: 'build/application.js'
}
}
var minify_options = {
application: {
src: [
'<banner:meta.banner>',
'<config:concat.libraries.dest>',
'<banner:meta.namespacing>',
'build/templates.js',
'<config:concat.application.dest>'
],
dest: 'application.min.js'
},
scripts: {
src: [
'<banner:meta.banner>',
'<config:concat.scripts.dest>'
],
dest: 'scripts.min.js'
}
}
var jshint_options = {
options: {
curly: true,
eqeqeq: true,
immed: true,
latedef: true,
newcap: true,
noarg: true,
sub: true,
undef: true,
boss: true,
eqnull: true,
browser: true
},
globals: {
jQuery: true
}
}
// Project configuration.
grunt.initConfig({
meta: metadata,
lint: { files: ['grunt.js'] },
qunit: { files: ['test/**/*.html'] },
ember_templates: templates_options,
concat: concat_options,
min: minify_options,
watch: {
files: ['<config:concat.application.src>'],
tasks: ['concat:application']
},
jshint: jshint_options
});
// Extra tasks.
grunt.loadNpmTasks('grunt-ember-templates');
// Default task.
grunt.registerTask('default', 'qunit ember_templates concat min');
};
i have a structure
-login
---login.hbs
-users
---users.hbs
---create.hbs
With default settings if templates are generate i see template names
login/login
users/users
users/create
I need "login/login" to be "login" only
"users/users" to be "users"
I tried different variations without any luck - can you suggest how task should looks like.
I've created the following grunt file:
https://gist.github.com/dd024b7637de636afce7
But I am not getting a result source file. I cannot see the task being called from the output either.
Could you let me know if my grunt.js file configuration is correct please?
Hi,
This is what I get:
Running "emberTemplates:dist" (emberTemplates) task
Warning: Encoding::UndefinedConversionError on line ["654"] of C: "\x90" to UTF-8 in conversion from Windows-1252 to UTF-8
Run with --trace to see the full backtrace Use --force to continue.
I am using inside a grunt server task but using --trace doesn't make any difference in the output
Similar to the AMD issue, original Handlebars supports CommonJS style output using --commonjs
or -c
.
This should allow the same.
Hello. I'm running into an error when compiling my templates and it doesn't provide any useful information as to where the error is occurring.
Warning: Running "emberTemplates:dist" (emberTemplates) task
>> Error: if doesn't match each
Warning: Ember Handlebars failed to compile ... Use --force to continue.
It would be nice if it told me what line is causing this error. I've manually searched my template and it appears all of my if/else/each match each other (other colleagues have confirmed too).
Can we have an option to just wrap the template content with Ember.Handlebars.compile()
like in rake-pipeline-web-filters
This will greatly reduce the template compilation time during development.
Currently ember-template-compiler has released version 1.9.0-alpha which has handlebars 2.0.0 as dependency. This is causing errors when running grunt-ember-templates, because it has a dependency >= 1 on ember-template-compiler which will pick up the alpha version.
Maybe it's better to change the dependency on ember-template-compiler in package.json to a stable version instead of latest.
Do not use ~v0.4.10 as it has handlebars 1.0.0 which is not compatible with the present version of ember ( rc-6 ) and gives an error.
For now ~0.4.9 is the right version.
Hi,
I'm trying to pre-compile my templates in Grunt with your module. It works perfectly on Ember 1.9 but now we want to upgrade to the latest version of Ember. That's why I tried to use your module as described with the ember-template-compiler.js
from downloaded from here.
This is how the task is setup:
module.exports = function (grunt) {
grunt.initConfig({
emberTemplates: {
'default': {
options: {
templateName: function (sourceFile) {
return sourceFile.replace('Views/Handlebars/', '').replace('.hbs', '');
},
templateCompilerPath: 'JS/libs/ember-template-compiler.js',
templateNamespace: 'HTMLBars',
handlebarsPath: 'JS/libs/handlebars-v3.0.1.js'
},
files: {
'JS/Templates.js': ['Views/Handlebars/*.hbs']
}
}
}
});
//Load the Ember template compiler
grunt.loadNpmTasks('grunt-ember-templates');
//Register default grunt task
grunt.registerTask('default', ['emberTemplates']);
};
But when I execute Grunt then this error occurs:
Running "emberTemplates:default" (emberTemplates) task
>> ReferenceError: window is not defined
Warning: Ember Handlebars failed to compile Views/Handlebars/addtrack.hbs. Use --force to continue.
Aborted due to warnings.
In order to be more consistent with other grunt plugins, I'm considering renaming the grunt task for this project from ember_templates
to emberTemplates
.
One of the issues I'm struggling with is whether to bump the minor version from 0.4
to 0.5
along with this change. Obviously, this would be a breaking change. However, I'm reticent to move to 0.5
, considering that this plugin is compatible with grunt ~0.4
, and most other grunt plugins are keeping pace with the same minor version.
Thoughts?
Can we add a check and see if grunt.version >= 0.4.0rc5 and potentially throw an error if the version isn't compatible?
I've seen some experiences in the wild where people spent a lot of time looking for something wrong and eventually finding their grunt version was wrong.
I have upgraded the grunt-ember-templating, with in return installed ember-template-compiler 1.9.0 alfa.
Once i reconfigured grunt to compile the hbs files into 1 template.js, my app does not render the templates anymore.
i use nodeJS with express framework
If i replace the "new" template with the "old" template ([email protected] and ember-template-compiler 1.8.0) the application works like expected.
I'm getting this result when compiling templates:
define(["ember"], function(Ember){
Ember.TEMPLATES["application"] = Ember.Handlebars.template([object Object]);
// ...
My grunt config looks something like this:
emberTemplates: {
compile: {
options: {
amd: true,
templateBasePath: PATH_SOURCE_HBS
},
files: [ {
src: [ PATH_SOURCE_HBS + '**/*.hbs'],
dest: PATH_SOURCE_JS_APP + 'templates.js'
} ]
}
}
It's only started recently, but nothing has changed in my configuration.
Update: for some reason NPM update was not working, I had to uninstall then re-install and it worked. If I could delete this I would. Sorry for jumping the gun.
. . .
Just updated to the latest release of ember/handlebars and loaded my app and got this error:
"Template was precompiled with an older version of Handlebars than the current runtime. Please update your precompiler to a newer version (>= 1.0.0) or downgrade your runtime to an older version (== 1.0.0-rc.4). "
However in looking at the repo here and handlebars.js it seems it has been updated so perhaps NPM is not finding the latest version?
Starting in v1.10, Ember is distributing the ember-template-compiler with the ember install.
grunt-ember-templates uses the ember-template-compiler package on npm, which is stuck at 1.9.
Do you have any plans to work out compatibility for newer versions of Ember?
Otherwise, I'd suggest making a note on your Readme.
Original Handlebars supports AMD style output using --amd
or -a
options used like:
handlebars -a -m -e hb ./js/photos > ./js/photos/templates.js
Since my entire application is based on Require.js, I need AMD compliant compiled templates.
All that is required is to wrap the current output with:
define(["Ember"],function(Ember){
// Current output goes here.
});
I think it should be fairly simple to add this feature. Please let me know if it has already been added.
Hi! Great, you published that one just in time for me, thanks!
Unfortunately for me it doesn't do anything. I took all the relevant parts from you example project. No error, but also nothing happens. Any hint how I can debug?
I get an error when launching the app coming from EMBER.TEMPLATES['index']
TypeError: 'undefined' is not a function (evaluating 'this.merge(helpers, Ember.Handlebars.helpers)')
I am running handlebars-1.0.0-rc.4 and ember-1.0.0-rc.6
Any idea what is happening ?
While running my tasks, jshint complain to how the template is compiled and suggest to use dot notation
app/templates/compiledTemplates.js
3 |Ember.TEMPLATES["index"] = Ember.Handlebars.template(function anonymous(Handlebars,depth0,helpers,partials,data) {
^ ['index'] is better written in dot notation.
1 error in 4 files
Warning: Task "jshint:files" failed. Use --force to continue.
I force and now I can work but I don't think is the best way using force..
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.