BorisMoore / jsrender

A lightweight, powerful and highly extensible templating engine. In the browser or on Node.js, with or without jQuery.
http://www.jsviews.com
MIT License
2.68k stars 340 forks source link

Mixed approach: Load jQuery statically, and JsRender/JsViews as a Browserify module #295

Closed daslicht closed 8 years ago

daslicht commented 8 years ago

Hi , I tried to implement this approach as described in the documentation and in the node example. But I still get that jQuery is missing.

Include jQuery in the layout : https://github.com/daslicht/jsviews-includes/blob/master/app/layout.html#L16

Include the Browserify Bundle: https://github.com/daslicht/jsviews-includes/blob/master/app/layout.html#L18

Finally include jsrender: https://github.com/daslicht/jsviews-includes/blob/master/public/index.js#L14

But I still get :

Uncaught TypeError: $.templates is not a function

What do I miss/oversee please?

Related: http://www.jsviews.com/#node/browserify

BorisMoore commented 8 years ago

It looks as if this may be a bug in my tmplify code. I'll look into it. Meantime you should be able to include jQuery in the client bundle, and it should work OK.

daslicht commented 8 years ago

ok

BorisMoore commented 8 years ago

If you want to try a local fix for this issue, you can go into the node_modules/jsrender folder and change the last line of jsrender.js:

https://github.com/daslicht/jsviews-includes/blob/master/node_modules/jsrender/jsrender.js#L2068

to

return $ || jsr;
}, window || this));
BorisMoore commented 8 years ago

Interesting. In fact this bug arose because previously I had the code var global = (0, eval)('this') - which worked fine also in the context of browserify. But I was forced to change that because of https://github.com/BorisMoore/jsviews/issues/323. So I switched to passing in the global parameter, from this - https://github.com/BorisMoore/jsrender/blob/master/jsrender.js#L2068. (See https://github.com/BorisMoore/jsrender/commit/f984e139deb0a7648d5b543860ec652c21f6dcf6#diff-79437e7f72c977b74a2d2d5d75ca518cL16.)

That works in most scenarios, but browserify calls that line of code from a 'compiled function' which has this set to {}. I don't know if I can make browserify use the global context this which will be window, when that code runs in the browser... My fix of window||this is in effect a workaround for this problem...

BorisMoore commented 8 years ago

This has been fixed with commit 75. (v0.9.75)