Angular
Library installation
info
Currently, iX only supports NgModule
based Angular projects. We are actively working to provide support for the new standalone component based approach soon. Otherwise Siemens iX is fully compatible with Angular version 17 and higher.
Install @siemens/ix
, @siemens/ix-angular
and @siemens/ix-icons
using a package manager:
- NPM
- Yarn
- PNPM
npm install @siemens/ix @siemens/ix-angular @siemens/ix-icons
yarn add @siemens/ix @siemens/ix-angular @siemens/ix-icons
pnpm add @siemens/ix @siemens/ix-angular @siemens/ix-icons
Import styles
Import the design system styling in your global stylesheet (e.g.: src/styles.scss
):
@import '@siemens/ix/dist/siemens-ix/siemens-ix.css';
Import IxModule
and BrowserAnimationsModule
(in some cases also the RouterModule.forRoot([/** your routes **/])
) in your application module.
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { IxModule } from '@siemens/ix-angular';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
@NgModule({
declarations: [AppComponent],
imports: [BrowserModule, AppRoutingModule, IxModule.forRoot(), BrowserAnimationsModule],
providers: [],
bootstrap: [AppComponent],
})
export class AppModule {}