@nx/reactSee schema

@nx/react:host

Create Module Federation configuration files for given React Consumer (Host) Application.

Usage

1nx generate host ... 2
1nx g consumer ... #same 2

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

You can specify the collection explicitly as follows:

1nx g @nx/react:host ... 2

Show what will be generated without writing to disk:

1nx g host ... --dry-run 2

Options

directory

dirRequired
string

The directory of the new application.

bundler

string
Default: rspack
Accepted values: rspack, webpack

The bundler to use.

devServerPort

number
Default: 4200

The port for the dev server of the Producer (remote) app.

name

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

The name of the Consumer (host) application to generate the Module Federation configuration

remotes

producers
Array<anything>
Default: []

A list of Producer (remote) application names that the Consumer (host) application should consume.

classComponent

C
boolean
Default: false

Use class components instead of functional component.

compiler

string
Default: babel
Accepted values: babel, swc

The compiler to use

dynamic

boolean
Default: false

Should the Consumer (host) application use dynamic federation?

e2eTestRunner

string
Default: playwright
Accepted values: playwright, 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

js

boolean
Default: false

Generate JavaScript files rather than TypeScript files.

linter

string
Default: eslint
Accepted values: eslint

The tool to use for running lint checks.

minimal

boolean
Default: false

Generate a React app with a minimal setup. No nx starter template.

style

s
string
Default: css

The file extension to be used for style files.

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.

ssr

boolean
Default: false

Whether to configure SSR for the Consumer (host) application

tags

t
string

Add tags to the application (used for linting).

typescriptConfiguration

boolean
Default: true

Whether the module federation configuration and webpack configuration files should use TS. When --js is used, this flag is ignored.

unitTestRunner

string
Default: jest
Accepted values: jest, none

Test runner to use for unit tests.

skipFormat

Internal
boolean
Default: false

Skip formatting files.

skipNxJson

Internal
boolean
Default: false

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

skipPackageJson

Internal
boolean
Default: false

Do not add dependencies to package.json.