patrickkettner/grunt-compile-handlebars

Unexpected token "<" when using html partials

Closed this issue · 7 comments

Hey,

I'm not quite sure if I'm just doing it wrong or if it's a bug (which I'd doubt because it'd be a huge bug that anybody should stumbled upon before).

When using the partials option I'm getting an error:

M:\src\views\bottomTeaser.html:1
(function (exports, require, module, __filename, __dirname) { <div class="bott
Warning: Unexpected token < Use --force to continue.

I'm using the following grunt task:

page: {
  template: 'src/static.html',
  partials: 'src/views/*.html',
  templateData: 'src/data.json',
  output: 'tmp/compiled.html'
},

My setup:

src/views/bottomTeaser.html (the partial I intended to use)

<div class="bottom-teaser">
  <h3>{{headline}}</h3>
</div>

src/static.html (the template to be compiled)

...
<body>
{{> bottomTeaser}}
</body>
...

... and I'm getting the "unexpected token" error mentioned above.

Okay, so I tried out several things and was able to solve my problem by changing one line inside of the tasks\compile-handlebars.js:

Old (broken):

partials.forEach(function (partial) {
  var basename = getBasename(partial, config.partials);
  handlebars.registerPartial(basename, require(path.resolve(partial)));
});

https://github.com/patrickkettner/grunt-compile-handlebars/blob/master/tasks/compile-handlebars.js#L137

New (working):

  var fs = require('fs');
  handlebars.registerPartial(basename, fs.readFileSync(path.resolve(partial), {
    encoding: 'utf-8'
  }));

So I replaced require by fs.readFileSync and it works just fine. The partials are resolved as expected.

Now I'm wondering if I am using it just wrong or if it's a bug that nobody ever had before?!

Hey, @manuelbieh - so sorry this took so long to address. Been out on business.

This was totally a bug - super sorry for letting it ship, and thanks so much for reaching out. fixes in 0.7.0

Hi Patrick,

I'm also using partials and noted that the call to "require" still exists in the code (line 148):

handlebars.registerPartial(basename, require(fs.realpathSync(partial)));

It should use fs.readFileSync as Manual said in his comment:

handlebars.registerPartial(basename, fs.readFileSync(fs.realpathSync(partial)));

Or alternatively grunt.file.read should also work:

handlebars.registerPartial(basename, grunt.file.read(fs.realpathSync(partial)));

Hey @oemmes
That was fixed in 0.7 - you should be good with any version after that.

Cheers!

thanks for the quick reply. But unfortunately it's not fixed yet (or I am totally wrong):

In your commit 382440a you replaced "path.resolve" with "fs.realpathSync", but eventually the file is still read with "require". And that causes the error for the partial templates, because they are HTML files and cannot be parsed by require as JavaScript. So the contents should be retrieved using a general file function instead of "require".

gosh, thats embarrassing. Sorry about that, have it fixed soon.

On Mon, Mar 24, 2014 at 11:18 AM, Nils Heuermann
notifications@github.comwrote:

thanks for the quick reply. But unfortunately it's not fixed yet (or I am
totally wrong):

In your commit 382440ahttps://github.com/patrickkettner/grunt-compile-handlebars/commit/382440aff5a42a5f4b42cbd61c2ee8027342c5ecyou replaced "path.resolve" with "fs.realpathSync", but eventually the file
is still read with "require". And that causes the error for the partial
templates, because they are HTML files and cannot be parsed by require as
JavaScript. So the contents should be retrieved using a general file
function instead of "require".

Reply to this email directly or view it on GitHubhttps://github.com//issues/13#issuecomment-38456814
.

patrick

released in 0.7.3

thanks. works fine now :)