Ignite UI CLI for React

    Our CLI tools provide project templates pre-configured for the Ignite UI for React toolset that help you get your next application off the ground in record time. The Ignite UI CLI is a stand-alone command-line tool for creating and scaffolding your applications for a variety of different frameworks and provides a substantial productivity boost for developers.

    Getting Started

    To get started, install the CLI:

    npm install -g igniteui-cli

    The above install command will make the Ignite UI CLI available for creation, scaffolding, and running of your Ignite UI for React application.

    Create a New Project

    To create an application that is configured to use the Ignite UI for React controls using the Ignite UI CLI, you can use the following template in your command line:

    ig new "[name_of_project]" --framework=[target_framework] --type=[project_type]

    Using the above template, if you wanted to create a React application named "My Project" targeting TypeScript, you could write the following command:

    ig new "My Project" --framework=react --type=igr-ts

    [!Note] TypeScript support will be available starting from Ignite UI CLI version 13.

    Adding Components

    Once you have created a project, you can then add additional component templates using ig add at any point. Running this command without any parameters will guide you through the available templates by using a keyboard navigation CLI to add the control of your choosing.

    ig add

    Alternatively, you can simply run the ig list command to get a full list of supported templates in the current project you have created.

    ig list

    After running ig list and you find the component template you would like to add, you can do so quickly by following this template in your command line:

    ig add [component_template] [component_name]

    The "component_template" above will generally match an Ignite UI for React component ("grid", "category-chart", "linear-gauge", etc.).

    For example, if you wanted to add a data grid templated component named "MyGridComponent" to your application, you could run the following:

    ig add grid MyGridComponent

    Build and Run the Application

    In order to build and run the Ignite UI for React application, you can call the ig build and ig run commands:

    ig build
ig run

    Using Vite

    The React application generated by Ignite UI CLI utilizes Vite as the build tool. Vite offers fast development and production builds, providing an efficient development experience with features like hot module replacement (HMR) during development.

    Ignite UI CLI Commands

    A full list of the available Ignite UI CLI commands and their usage (like passing flags, etc.), can be found at the Ignite UI CLI wiki pages:

    Command Alias Description
    ig start Builds the application, starts a web server and opens the application in the default browser.
    ig build Builds the application into an output directory
    ig generate g Generates a new custom template for supported frameworks and project types
    ig help -h Lists the available commands and provides a brief description of what they do.
    ig config Performs read and write operation on the Ignite UI CLI configuration settings.
    ig doc Searches the Infragistics knowledge base for information about a given search term
    ig list l Lists all templates for the specified framework and type. When you run the command within a project folder it will list all templates for the project's framework and type, even if you provide different ones.
    ig test Executes the tests for the current project.
    ig version -v Shows Ignite UI CLI version installed locally, or globally if local is missing