Nx

Next generation build system with first class monorepo support and powerful integrations.

Getting Started

Create a new workspace

pnpm dlx create-nx-workspace@latest <workspace-name> \
    --preset=ts \
    --packageManager=pnpm \
    --nxCloud=false

Common Generators

@nx/plugin - For building plugins, which contain executors and generators

pnpm i -D @nx/plugin

• Docs
• Local Generators - Docs

Useful default generator config

nx.json

{
    "generators": {
        "@nx/plugin": {
            "plugin": {
                "e2eTestRunner": "none",
                "unitTestRunner": "none"
            }
        }
    }
}

@nx/react - For building React applications and libraries

pnpm i -D @nx/react

• Docs

Useful default generator config

nx.json

{
    "generators": {
        "@nx/react": {
            "application": {
                "style": "none",
                "linter": "eslint",
                "bundler": "webpack",
                "babel": true
            },
            "component": {
                "style": "none"
            },
            "library": {
                "style": "css",
                "linter": "eslint",
                "compiler": "swc",
                "minimal": true,
                "bundler": "vite",
                "pascalCaseFiles": true,
                "unitTestRunner": "jest"
            },
            "host": {
                "compiler": "swc",
                "minimal": true,
                "devServerPort": 3000,
                "e2eTestRunner": "none",
                "pascalCaseFiles": true
            },
            "remote": {
                "compiler": "swc",
                "devServerPort": 3000,
                "e2eTestRunner": "none",
                "pascalCaseFiles": true
            },
            "storybook-configuration": {
                "configureCypress": false,
                "generateCypressSpecs": false,
                "tsConfiguration": true
            }
        }
    }
}

• Application options
• Component options
• Library options
• Host options
• Remote options
• Storybook-configuration options

@nx/next - For building Next.js apps

pnpm i -D @nx/next

• Docs

Useful default generator config

nx.json

{
    "generators": {
        "@nx/next": {
            "application": {
                "style": "none",
                "linter": "eslint",
                "unitTestRunner": "none",
                "e2eTestRunner": "none",
                "swc": true
            }
        }
    }
}

• Application options

Common Commands

Run formatter

nx format:write

Resources

• Homepage
  • Docs

---

Last update: August 11, 2023
Created: June 25, 2023