Open MeirionHughes opened 7 years ago
<template>
<require from="styles.css!module!bind" as="styles"></require>
<div class.one-time="styles.first">First</div>
<div class.one-time="styles.second">Second</div>
</template>
this explicit example could be triaged by examining the as="styles"
and adding styles
to the template context. That at least would allow ignoring (not cause issues) any bindings to it.
https://github.com/bryanrsmith/aurelia-react-loader
<template>
<require from="my-react-component.js!react-component"></require>
<my-react-component props.bind="{ name: in.value, onClick: submit }"></my-react-component>
</template>
... can also be triaged by ignoring any unknown custom element (current behaviour in 0.9).
Best I can do for now is to stub a Loader
class and abstract this away. The default would be called for all require elements and would simply import resources from source files.
Configurable by changing loader
in Config
.
Aurelia supports quite a varied array of loaders some of which change the local context. For example:
https://github.com/bryanrsmith/aurelia-binding-loader
The comprehensive solution would be to actually use the loader plug-in directly and use the template resources it produces. However, this also means that the base project files require transpiling i.e. if you are using
.scss
then any look up for a.css
file would require transpiling the scss to css first, in memory.Same applies to any relative path "module" look-up with a typescript file requiring transpiling into memory before being fed to the loader.