jstify icon indicating copy to clipboard operation
jstify copied to clipboard

Error in jstify lodash template processing

Open hyperknot opened this issue 10 years ago • 5 comments

The following template:

<div<% if (d.editMode) { %>test<% } %>

breaks browserify - jstify with lodash engine, while working perfectly in node _.template.

Working node script:

var _ = require('lodash');
var test = '<div<% if (d.editMode) { %>test<% } %>';


var t = _.template(test, {
    variable: 'd'
});

console.log(t({editMode: true}));

Browserify js:

bundler.transform('jstify', {
    engine: 'lodash',
    templateOpts: {
        variable: 'd'
    }
});

Broken browserify log:

events.js:87
      throw Error('Uncaught, unspecified "error" event.');
            ^
Error: Uncaught, unspecified "error" event.
    at Error (native)
    at Readable.emit (events.js:87:13)
    at Labeled.<anonymous> (.../node_modules/read-only-stream/index.js:28:44)
    at Labeled.emit (events.js:107:17)
    at Labeled.<anonymous> (.../node_modules/stream-splicer/index.js:130:18)
    at Labeled.emit (events.js:129:20)
    at Deps.<anonymous> (.../node_modules/stream-splicer/index.js:130:18)
    at Deps.emit (events.js:107:17)
    at DuplexWrapper.<anonymous> (.../node_modules/module-deps/index.js:241:18)
    at DuplexWrapper.emit (events.js:129:20)

hyperknot avatar Dec 09 '15 04:12 hyperknot

From the docs:

minifierOpts ... Set to false to disable HTMLMinifier (This is useful for when your template looks like broken markup and the minifier is complaining).

Try:

bundler.transform('jstify', {
    engine: 'lodash',
    minifierOpts: false,
    templateOpts: {
        variable: 'd'
    }
});

zertosh avatar Dec 12 '15 18:12 zertosh

Same error with minifierOpts disabled.

node script:

#!/usr/bin/env node


var browserify = require('browserify');
var fs = require('fs');

var bundler = browserify();

bundler.add('app.js');
bundler.transform('jstify', {
    engine: 'lodash',
    minifierOpts: false,
    templateOpts: {
        variable: 'd'
    }
});

bundler.bundle().pipe(fs.createWriteStream('out.js'));

app.js:

require('./test.tmp');

test.tmp:

<div<% if (d.editMode) { %>test<% } %>

hyperknot avatar Dec 12 '15 19:12 hyperknot

The transform is only be applied to .ejs, .tpl, .jst, or .html files.

Try changing .tmp to one of those

zertosh avatar Dec 12 '15 19:12 zertosh

Sorry, it should have been tpl indeed. Yes, disabling minifier fixes it! Thanks.

BTW, any reason why minifier is enabled by default? It surely is a strange default settings, some older browsers (notably Safari) are sensitive to whitespace in HTML and also this bug.

hyperknot avatar Dec 12 '15 19:12 hyperknot

np. That was my original use case and it kinda stayed that way. So legacy I guess.

zertosh avatar Dec 12 '15 19:12 zertosh