How to use with `_WidgetsInTemplateMixin`

[anatoliyarkhipov]

Hi! At first, let me say thanks for this awesome package. Our team was happy to find it.

During the migration we encountered some problems with _WidgetsInTemplateMixin. Because the default Dojo loader was not used, _WidgetsInTemplateMixin was not able to get the loaded widgets from the Dojo modules cache.

For example, if we have something like that:

<div class="${rootLayout}">
  <div data-dojo-type="dijit/layout/ContentPane"
       data-dojo-attach-point="toolbarRegion">
    Toolbar
  </div>
</div>

then _WidgetsInTemplateMixin cannot find the ContentPane and gonna try to require it using the default Dojo loader. And it fails for the obvious reasons.

To fix this problem we found the next solution: in widgets that uses _WidgetsInTemplateMixin we just define contextRequire property. It looks like this:

contextRequire: {
  _dojoParserCtorMap: {
    'dijit/layout/ContentPane': require('dijit/layout/ContentPane'),
  },
},

In this case _WidgetsInTemplateMixin doesn't try to load the widgets but just takes them from the _dojoParserCtroMap property. We can just define in this way all widgets that are used in the template, and it works just fine.

Hope this will help someone who got the same problems.

P.S. After writing this message I found in the Readme, that dojo-webpack-loader provides some API to register widgets 😅. @Nordth could you please explain how to use it?