Changing the naming convention for Aurelia View Model class names
I was working on a large Aurelia project and having trouble with clashing names
of JS classes. The convention for Aurelia View Models is that their class names
end in CustomElement
. But to prevent clashes, I wanted to ensure that View Models
attached to routes ended in Route
and components in Component
(e.g. an
EmailRoute
might contain a EmailComponent
). I didn’t find a built-in way to
instruct the Aurelia loader to interpret class names this way, but it turned out
to be pretty easy to make an override:
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import {HtmlBehaviorResource} from "aurelia-framework"; | |
const orig: (...args: any[]) => any = HtmlBehaviorResource.convention; | |
HtmlBehaviorResource.convention = function(name: string, ...args: any[]) { | |
if (name.endsWith("Component")) { | |
name = name.replace(/Component$/, "CustomElement"); | |
} | |
if (name.endsWith("Route")) { | |
name = name.replace(/Route$/, "CustomElement"); | |
} | |
return orig.apply(this, [name, ...args]); | |
} |