Custom elements from outside the src directory

I have two Aurelia apps which share both design and functional elements. To achieve this I have a third shared Aurelia project in which I keep all the SCSS and TS classes that are common between the two projects and I reference them from here. There’s one thing I haven’t been able to make shared though, and that is custom elements. Using this approach:

<require from="./../resources/elements/some-custom-element"></require>

I’ve only been able to require custom elements from within the current app’s src folder. Trying any other URI has ended with me getting a Webpack error message.

How do I reference a custom element from a completely different folder than the root one of the current project? Thanks ahead.

1 Like

It requires some special setup in bundler to load source directly from other directory.

The recommended solution is to put shared func and shared elements in an Aurelia plugin project, then use the plugin in both apps.

Creating plugin is easy, just follow https://aurelia.io/docs/plugins/write-new-plugin

3 Likes

Okay I will try this approach and report back with the results.

1 Like