DEV Community

NullVoxPopuli
NullVoxPopuli

Posted on

unsupported ambiguity between helper and component

This error occurs when you're progressing towards a modern ember app and have the following situation in your embroider options:

staticHelpers: true,
staticComponents: false,
Enter fullscreen mode Exit fullscreen mode

and you reference a helper, such as {{t}} from ember-intl.

Here is the full text:

<path to source of issue>: 
  unsupported ambiguity between helper and component: 
    this use of "{{t}}" could be helper "{{ (t) }}" or
    component "<T />", and your settings for 
    staticHelpers and staticComponents do not agree. 
  Either switch to one of the unambiguous forms, 
    or make staticHelpers and staticComponents agree, 
    or use a "disambiguate" packageRule to work around 
    the problem if its in third-party code you cannot 
    easily fix. 
  in <path to source of issue>
Enter fullscreen mode Exit fullscreen mode

To resolve, in your ember-cli-build.js, you want:

 const { Webpack } = require('@embroider/webpack');

  return require('@embroider/compat').compatBuild(app, Webpack, {
    // ...
    staticHelpers: true,
    staticComponents: true,
    // ...
  });
Enter fullscreen mode Exit fullscreen mode

When both of these options are true, there is no more ambiguity with curly syntax ({{ }}) -- if it exists, it will be either a helper or a component, we don't need to guess at runtime anymore.

Top comments (0)