Problem using "use strict" and underscore.js

Question

I wrote an application using Yeoman and backbone.js. At the top of each js file, I indicated 'use strict'; , and when I run my grunt tasks, jshint does not encounter any errors.

I can create my application with grunt without problems, however, when I try to run juglified js, I get the following error:

Uncaught SyntaxError: Strict mode code may not include a with statement

I was looking for a code base, and the only things using the with statement are underscores.

I am new to strict mode, so I don’t know how I can solve this problem. Can I use strict mode anywhere I use the underscorejs function?

Thanks.

EDIT:

Given the code examples below (abbreviated for brevity). How can I change it to solve this problem.

 'use strict'; /*global, Backbone, JST*/ var MyView = Backbone.View.extend({ template: JST['app/scripts/templates/MyView.ejs'], initialize: function() { this.render(); }, render : function() { this.$el.html(this.template(this.templateVariables())); return this; }, templateVariables: function() { return {var1 : 'Hello', var2 : 'World'}; } }); 

in MyView.ejs

 <p><%= var1 %><%= var2 %>!</p> //<p>Hello World!</p> 

EDIT 2:

Using @mu's answer too short below, I found that the best way to resolve calls on _.template, which made me sad, changed my grunt-JST task as follows:

 jst: { compile: { options: { templateSettings: { variable: 'data' } }, files: { '.tmp/scripts/templates.js': ['<%= yeoman.app %>/scripts/templates/*.ejs'] } } }, 

And then change each of my templates to use the format <%= data.templateVariable %> .

May not apply to others, but I ran into this problem using Yeoman with Grunt and a Backbone generator, so I can't be the only one.

Answer 1

The underscore _.template uses with to enable things like <%= pancakes %> on obj.pancakes . If you look inside _.template , you will find the following:

 if (!settings.variable) source = 'with(obj||{}){\n' + source + '}\n'; 

Where the offensive comes from. If you use precompiled JST style templates, this source is what you get inside your JST object, and that will make with visible within "use strict" . Notice that settings.variable there? The documentation says:

By default, a template places values ​​from your data in a local area using the with statement. However, you can specify the same variable name with the variable parameter. This can greatly improve the speed with which the template can display.

 _.template("Using 'with': <%= data.answer %>", {answer: 'no'}, {variable: 'data'}); => "Using 'with': no" 

That way, you can suppress with with the variable parameter when compiling templates; of course, this also means that you will have to rewrite all <%= ... %> parts of your templates according to what the variable parameter can say (this should also speed up your templates so that it can be worth it just for that).

In your case, you change the template to this:

 <p><%= data.var1 %><%= data.var2 %>!</p> //<p>Hello World!</p> 

and then you will need to change the _.template call, which is used to compile the templates, to look like this:

 var compiled_template = _.template(raw_template, null, { variable: 'data' }); 

You do not need to use data , of course, you just need to use the same thing both in templates and in the _.template call.

I don’t know how you would change your customized _.template calls, but it should not be so difficult. I suppose you could schedule the _.template monkey to have a default value for variable as a last resort.

Here is a simple demo that should illustrate what happens: http://jsfiddle.net/ambiguous/Az8QM/

---

Alternatively, if we look at how "use strict" has scope , we will see that:

Strict mode applies to all scripts or to individual functions.

So, you can localize your rigor like this:

 (function() { "use strict"; // All your non-JST JavaScript goes here. })(); // Append your JST out here. 

You can also use two JavaScript files instead of one:

• One for your non-JavaScript template with "use strict" included.
• The second one with your JST , this one is not "use strict" .