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:

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]);
}