Nx Commands Reference

Quick reference for Nx monorepo commands used in the EBRAINS UI Ecosystem.

Generate Commands

Generate React Application

Common options:

  • --directory - Where to create the app
  • --style - CSS, scss, styled-components, emotion
  • --bundler - vite (recommended), webpack
  • --routing - true/false (include React Router)
  • --unitTestRunner - vitest, jest, none

Generate React Library

Generate React Component

Generate Hook

Development Commands

Serve Application

Common serve ports:

  • Applications: 4200, 4300, 4400
  • Handbook (Hugo): 1313

Build Application

Output location:

  • Default: dist/apps/<app-name>/

Test Application

Lint Application

Monorepo Commands

Run Task for Multiple Projects

Affected Commands

Project Graph

Workspace Commands

List Projects

Reset Nx Cache

Workspace Configuration

Hugo (Handbook) Commands

The EBRAINS Handbook uses Hugo, accessed through Nx:

Handbook URL: http://localhost:1313

Common Workflows

Create New React App

Create Shared Library

Run Quality Checks

Check What Changed

Configuration Files

Project Configuration

Location: apps/<app-name>/project.json or packages/<lib-name>/project.json

Workspace Configuration

Location: nx.json

Package Management

Install Dependencies

Update Dependencies

Debugging

Verbose Output

Skip Cache

Environment Variables

Common Options

OptionDescriptionExample
--helpShow helpnx serve --help
--versionShow Nx versionnx --version
--verboseVerbose outputnx build my-app --verbose
--skip-nx-cacheSkip Nx cachenx build my-app --skip-nx-cache
--parallelRun tasks in parallelnx run-many --target=test --all --parallel=3
--output-styleOutput formatnx build --output-style=stream

Troubleshooting

Port Already in Use

Command Not Found: nx

Module Not Found

Cache Issues

Build Fails After Dependency Update

Best Practices

Do

  • Use npx nx instead of global nx for consistency
  • Run nx affected for efficient CI/CD
  • Use Nx cache for faster builds
  • Generate projects with Nx generators
  • Keep dependencies up to date
  • Use --dry-run to preview changes
  • Review project.json for custom targets

Don’t

  • Don’t modify dist/ folder manually
  • Don’t skip migrations after updates
  • Don’t use nx reset as first debugging step
  • Don’t ignore linting errors
  • Don’t create projects manually (use generators)
  • Don’t commit node_modules/

Quick Reference Table

TaskCommand
Generate React appnpx nx generate @nx/react:application my-app
Serve appnx serve my-app
Build appnx build my-app
Test appnx test my-app
Lint appnx lint my-app
View graphnx graph
Run for allnx run-many --target=build --all
Run affectednx affected --target=test
Reset cachenx reset
List projectsnx list

Related Documentation