Aurelia UI Framework

5.0.0-beta.4 verified Sat Apr 25 auth: no javascript

A bespoke UI/UX framework for business applications built on Aurelia. Current stable version is 5.0.0-beta.4 (beta). Release cadence is irregular; the repository has low activity with infrequent updates. Differentiators: tailored for enterprise desktop-like apps, includes date/number formatting via date-fns and numeral, markdown rendering via kramed, phone number parsing via libphonenumber-js, and resize observer polyfill. Ships TypeScript types. Heavily depends on Aurelia ecosystem (aurelia-framework, aurelia-binding, aurelia-templating, aurelia-pal).

Common errors

error Cannot find module 'aurelia-ui-framework' ↓

cause Package not installed or incorrect import path.

fix

Run 'npm install aurelia-ui-framework' and ensure import path is correct.

error Module not found: Error: Can't resolve 'aurelia-binding' ↓

cause Missing resolve alias for linked local dependency.

fix

Add resolve.alias for 'aurelia-binding' in webpack.config.js.

error TypeError: aurelia.use.plugin is not a function ↓

cause Trying to call plugin registration without proper Aurelia instance.

fix

Ensure you are inside the Aurelia configure function and aurelia.use is available.

Warnings

breaking v5.0.0-beta.x requires Aurelia v2 (aurelia-framework v2). Do not use with Aurelia v1. ↓

fix Upgrade your Aurelia application to v2 before using this package.

deprecated The package is in beta and may introduce breaking changes without major semver increments. ↓

fix Pin exact version in package.json and test thoroughly on upgrade.

gotcha Requires Webpack resolve aliases for aurelia-binding, aurelia-framework, aurelia-templating, aurelia-pal when used as a linked local dependency. ↓

fix Add resolve.symlinks = false and resolve.alias entries in webpack.config.js as shown in README.

Install

npm install aurelia-ui-framework

yarn add aurelia-ui-framework

pnpm add aurelia-ui-framework

Imports

AureliaUI

wrong

const AureliaUI = require('aurelia-ui-framework');

correct

import { AureliaUI } from 'aurelia-ui-framework';

ESM-only; commonjs require will not work. Use ES modules.

configure
```
import { configure } from 'aurelia-ui-framework';
```
Function to register plugin with Aurelia's configure() in main.ts.
default
wrong
```
import { default } from 'aurelia-ui-framework';
```
correct
```
import AureliaUI from 'aurelia-ui-framework';
```
Default export is the plugin class; you can use named import 'AureliaUI' or default.

Quickstart

Shows how to register the aurelia-ui-framework plugin in an Aurelia application's main.ts, with optional configuration.

// main.ts
import { Aurelia } from 'aurelia-framework';
import { configure } from 'aurelia-ui-framework';

export function configure(aurelia: Aurelia): void {
  aurelia.use
    .standardConfiguration()
    .developmentLogging();

  // Register the UI framework plugin
  aurelia.use.plugin('aurelia-ui-framework', (config) => {
    // Optional: configure date format, locale, etc.
    config.dateFormat = 'yyyy-MM-dd';
    config.locale = 'en-US';
  });

  aurelia.start().then(() => aurelia.setRoot());
}