Dynamic partials template with handlebars-loader

How to handle dynamic partials? Here the solution!

I’m actually working to move out from bower/grunt to webpack, we do use handlebars for templating with precompiled templates/partials.

Here how to manage dynamic partials with handlebars-loader.

During the migration, I find out that handlebars-loader cannot manage dynamic partials… (see Issue #81)

I figured out that webpack guide lines for loader is :

  1. A loader is a single function
  2. Should do only 1 task
  3. Should not have any state when launching the task

That’s why handlebars-loader create a handlebars context when it compile.

To handle dynamic partials like {> (whichPartial)} or {> lookup . 'myVar'} we will register partials by our self.

Just register all your “partials” that could be called dynamically.

import Handlebars from 'handlebars'
import MyPartial1 from './_myPartial1.handlebars'
Handlebars.partials['myPartial1'] = MyPartial1; // < Here we register precompiled as partial.

Hope that’s help!