@nrwl/react:application

Create a React application for Nx.

Examples

Create an application named my-app:

nx g @nrwl/react:application my-app

Usage

nx generate application ...
nx g app ... #same

By default, Nx will search for application in the default collection provisioned in workspace.json.

You can specify the collection explicitly as follows:

nx g @nrwl/react:application ...

Show what will be generated without writing to disk:

nx g application ... --dry-run

Examples

Generate apps/myorg/myapp and apps/myorg/myapp-e2e:

nx g app myapp --directory=myorg

Use class components instead of functional components:

nx g app myapp --classComponent

Set up React Router:

nx g app myapp --routing

Options

bundler

string
Default: webpack
Accepted values: vite, webpack

The bundler to use.

classComponent

C
boolean
Default: false

Use class components instead of functional component.

compiler

string
Default: babel
Accepted values: babel, swc

The compiler to use.

directory

dir
string

The directory of the new application.

e2eTestRunner

string
Default: cypress
Accepted values: cypress, none

Test runner to use for end to end (E2E) tests.

globalCss

boolean
Default: false

Default is false. When true, the component is generated with *.css/*.scss instead of *.module.css/*.module.scss.

inSourceTests

boolean
Default: false

When using Vitest, separate spec files will not be generated and instead will be included within the source files. Read more on the Vitest docs site: https://vitest.dev/guide/in-source.html

js

boolean
Default: false

Generate JavaScript files rather than TypeScript files.

linter

string
Default: eslint
Accepted values: eslint, none

The tool to use for running lint checks.

minimal

boolean
Default: false

Generate a React app with a minimal setup, no separate test files.

name

string
Pattern: ^[a-zA-Z].*$

The name of the application.

pascalCaseFiles

P
boolean
Default: false

Use pascal case component file name (e.g. App.tsx).

routing

boolean
Default: false

Generate application with routes.

rootProject

Hidden
boolean
Default: false

Create a application at the root of the workspace

style

s
string
Default: css

The file extension to be used for style files.

skipFormat

boolean
Default: false

Skip formatting files.

skipWorkspaceJson

boolean
Default: false

Skip updating workspace.json with default options based on values provided to this app (e.g. babel, style).

strict

boolean
Default: true

Creates an application with strict mode and strict type checking.

setParserOptionsProject

boolean
Default: false

Whether or not to configure the ESLint parserOptions.project option. We do not do this by default for lint performance reasons.

standaloneConfig

boolean

Split the project configuration into <projectRoot>/project.json rather than including it inside workspace.json.

skipDefaultProject

boolean
Default: false

Skip setting the project as the default project. When false (the default), the project is set as the default project only if there is no default project already set.

skipPackageJson

boolean
Default: false

Do not add dependencies to package.json.

tags

t
string

Add tags to the application (used for linting).

unitTestRunner

string
Default: jest
Accepted values: jest, vitest, none

Test runner to use for unit tests.