Ignite UI CLI

15.0.0 verified Thu Apr 23 auth: no javascript

The `igniteui-cli` is a robust command-line interface tool engineered to accelerate the development of applications utilizing Ignite UI components. It empowers developers to rapidly scaffold new projects across popular frameworks such as Angular, React, and jQuery, and efficiently integrate individual components or complex scenario-based templates like dashboards into existing applications. The current stable version, 15.0.0, marks a significant major release, modernizing all Angular templates, embedding AI agent configurations into scaffolded projects, and introducing the Ignite UI CLI Model Context Protocol (MCP) Server to provide AI assistants with documentation, API reference lookup, and scaffolding capabilities. This version also deprecates and removes legacy wrapper-based project types, steering developers toward modern practices. The CLI undergoes frequent updates, particularly with major versions bringing substantial feature enhancements and breaking changes, distinguishing itself through comprehensive multi-framework support and a guided development experience.

Common errors

error command not found: ig ↓

cause The igniteui-cli package was not installed globally, or its executable path is not in your system's PATH environment variable.

fix

Run npm install -g igniteui-cli to install the CLI globally. If the issue persists, ensure your npm global bin directory is in your system's PATH.

error Error: Port X is already in use ↓

cause The default port for your project type (e.g., Angular, React) is currently occupied by another application or a previous instance of your project.

fix

Either terminate the application using the port or consult the Ignite UI CLI documentation for the ig start command to learn how to specify a different port (e.g., ig start --port 4201).

error Error: Project type 'legacy-wrapper' is no longer supported. Please choose a modern project template. ↓

cause Attempting to create a project using a deprecated project type that was removed in version 15.0.0.

fix

Update your command to use a modern project type, such as igx-ts for Angular or igr-ts for React. Refer to the latest documentation for available project types.

Warnings

breaking Version 15.0.0 has removed support for legacy wrapper-based project types. Existing projects using these types must be migrated or recreated using modern templates. ↓

fix Migrate your project to use modern Angular (igx-ts) or React (igr-ts) templates, or recreate the project with a supported type. Refer to the official Ignite UI migration guides for details.

gotcha When using `ig new`, if `--framework`, `--type`, or `--theme` are not specified, the CLI will default to a jQuery framework and the first available project type/theme. This can lead to an unexpected project setup if not explicitly defined. ↓

fix Always explicitly define `--framework`, `--type`, and `--theme` parameters when creating a new project to ensure you get the desired setup, e.g., `ig new "MyProject" --framework=angular --type=igx-ts --theme=material`.

gotcha The `ig start` command attempts to open the scaffolded project in the default browser using a predefined port. If this port is already in use by another application, the project may not launch automatically or could fail to start. ↓

fix Check the `ig start` command documentation on the Ignite UI CLI Wiki for information on default ports and how to specify an alternative port if needed. You may also need to identify and terminate the process currently using the port.

Install

npm install igniteui-cli

yarn add igniteui-cli

pnpm add igniteui-cli

Imports

igniteui-cli (Global Tool)
wrong
```
import { igniteui } from 'igniteui-cli';
const igniteui = require('igniteui-cli');
```
correct
```
npm install -g igniteui-cli
# Then use 'ig' or 'igniteui' commands
```
This package is a command-line interface (CLI) tool designed for global installation and execution via the `ig` or `igniteui` commands, not for programmatic import within JavaScript/TypeScript files.
ig new (Scaffold Project)
wrong
```
newProject("MyAngularApp", ...);
igniteui create "MyAngularApp"
```
correct
```
ig new "MyAngularApp" --framework=angular --type=igx-ts --template=side-nav
```
The `ig new` command is used to scaffold new Ignite UI projects. It's crucial to specify the `--framework` and optionally `--type` and `--template` to get the desired project structure and components. Running `ig` without parameters starts an interactive guide.
ig add (Add Component)
wrong
```
addComponent('grid');
igniteui addComponent grid
```
correct
```
ig add grid --name=MyDataGrid
```
The `ig add` command is used to add new components or templates to an *existing* Ignite UI project. Running `ig add` without parameters provides an interactive selection of available templates.

Quickstart

This quickstart demonstrates the global installation of igniteui-cli, interactive project creation, direct project scaffolding for Angular, adding a new component, and finally building and running the generated application.

npm install -g igniteui-cli

# Start an interactive guided experience
ig

# Or create a new Ignite UI for Angular project directly
ig new "MyDashboardApp" --framework=angular --type=igx-ts --template=dashboard

# Navigate into the new project directory
cd MyDashboardApp

# Add a new grid component to the project
ig add grid --name=EmployeesGrid

# Build and run the application
ig start