In v1, I could do this:
<compose view="./some-file.html"></compose>
where some-file.html is simply located under the src
folder (not at an endpoint to be reached by fetch or some other HTTP API).
When it comes to icons, I like to place the SVG in an HTML file, for something like icon-warning.html. I’ll compose those in (where dynamic composition is warranted) using either
<compose view="icon-warning.html"></compose>
or
<compose view.bind="currentIcon"></compose>
where currentIcon
is specified in the viewModel with #PLATFORM.moduleName
.
I’ve figured out most of the new composition API . But how do I go about composing in an HTML file only (a view-only scenario)? Or is that not possible (or necessary) any longer?
Your question is addressed here https://docs.aurelia.io/getting-to-know-aurelia/dynamic-composition#migrating-from-aurelia-1-less-than-compose-greater-than
this is the main difference between v1 and v2:
In Aurelia 2, passing a string to the view or view-model properties no longer means module name. In Aurelia 1, the module would be resolved to a file. In v2, the view property only understands string values, and the view-model property only understands objects and classes.
The reason for this is accepting string as module makes the framework take care of the module resolution, which is very complicated to get right, especially when there’s build tools involved. V1 webpack plugin is quite a nice piece of work with its ability to bridge build time module structure with runtime loading. Though it’s tough to maintain. We don’t want to carry that forward.
Thank you for your response!
I was aware of the [welcome] change to composition. I was thinking that I was missing view-only dynamic composition. I think with @customElement
, I can eliminate the need for an HTML file for every single icon, provided that SVG can be processed directly out of the decorator. Those little icons are never terribly complicated.