nx-workspace-patterns

name	nx-workspace-patterns
description	"condition: Recurso ou ferramenta necessária indisponível"

Nx Workspace Patterns

Production patterns for Nx monorepo management.

Do not use this skill when

• The task is unrelated to nx workspace patterns
• You need a different domain or tool outside this scope

Instructions

• Clarify goals, constraints, and required inputs.
• Apply relevant best practices and validate outcomes.
• Provide actionable steps and verification.
• If detailed examples are required, open resources/implementation-playbook.md.

Use this skill when

• Setting up new Nx workspaces
• Configuring project boundaries
• Optimizing CI with affected commands
• Implementing remote caching
• Managing dependencies between projects
• Migrating to Nx

Core Concepts

1. Nx Architecture

workspace/
├── apps/              # Deployable applications
│   ├── web/
│   └── api/
├── libs/              # Shared libraries
│   ├── shared/
│   │   ├── ui/
│   │   └── utils/
│   └── feature/
│       ├── auth/
│       └── dashboard/
├── tools/             # Custom executors/generators
├── nx.json            # Nx configuration
└── workspace.json     # Project configuration

2. Library Types

Type	Purpose	Example
feature	Smart components, business logic	feature-auth
ui	Presentational components	ui-buttons
data-access	API calls, state management	data-access-users
util	Pure functions, helpers	util-formatting
shell	App bootstrapping	shell-web

Templates

Template 1: nx.json Configuration

{
  "$schema": "./node_modules/nx/schemas/nx-schema.json",
  "npmScope": "myorg",
  "affected": {
    "defaultBase": "main"
  },
  "tasksRunnerOptions": {
    "default": {
      "runner": "nx/tasks-runners/default",
      "options": {
        "cacheableOperations": [
          "build",
          "lint",
          "test",
          "e2e",
          "build-storybook"
        ],
        "parallel": 3
      }
    }
  },
  "targetDefaults": {
    "build": 
       
        
       
    
     
         
       
    
     
        
       
    
     
        
       
    
  
   
      
     
      
      
      
      
      
    
     
      
      
    
  
   
     
       
         
         
         
      
       
         
         
      
       
         
      
    
  

Template 2: Project Configuration

// apps/web/project.json
{
  "name": "web",
  "$schema": "../../node_modules/nx/schemas/project-schema.json",
  "sourceRoot": "apps/web/src",
  "projectType": "application",
  "tags": ["type:app", "scope:web"],
  "targets": {
    "build": {
      "executor": "@nx/webpack:webpack",
      "outputs": ["{options.outputPath}"],
      "defaultConfiguration": "production",
      "options": {
        "compiler": "babel",
        "outputPath": "dist/apps/web"
         
         
         
         
         
      
       
         
           
           
           
        
         
           
           
           
           
        
      
    
     
       
       
       
         
      
       
         
           
        
         
           
        
      
    
     
       
       
       
         
         
      
    
     
       
       
       
         
      
    
  

Template 3: Module Boundary Rules

// .eslintrc.json
{
  "root": true,
  "ignorePatterns": ["**/*"],
  "plugins": ["@nx"],
  "overrides": [
    {
      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
      "rules": {
        "@nx/enforce-module-boundaries": [
          "error",
          {
            "enforceBuildableLibDependency": true,
            "allow": [],
            "depConstraints": [
              
                 
                 
                  
                  
                  
                  
                
              
              
                 
                 
                  
                  
                  
                
              
              
                 
                  
              
              
                 
                  
              
              
                 
                 
              
              
                 
                  
              
              
                 
                  
              
              
                 
                 
              
            
          
        
      
    
  

Template 4: Custom Generator

// tools/generators/feature-lib/index.ts
import {
  Tree,
  formatFiles,
  generateFiles,
  joinPathFragments,
  names,
  readProjectConfiguration,
} from '@nx/devkit';
import { libraryGenerator } from '@nx/react';

interface FeatureLibraryGeneratorSchema {
  name: string;
  scope: string;
  directory?: string;
}

export default async function featureLibraryGenerator(
  tree: Tree,
  options: FeatureLibraryGeneratorSchema
) {
  const { name, scope, directory } = options;
  const projectDirectory = directory
    ? `${directory}/${name}`
    : `libs/${scope}/feature-${name}`;

  // Generate base library
  await libraryGenerator(tree, {
    name: `feature-${name}`,
    directory: projectDirectory,
    tags: `type:feature,scope:${scope}`,
    style: 'css',
    skipTsConfig: false,
    skipFormat: true,
    : ,
    : ,
  });

  
   projectConfig = (tree, );
   projectNames = (name);

  (
    tree,
    (__dirname, ),
    projectConfig.,
    {
      ...projectNames,
      scope,
      : ,
    }
  );

   (tree);
}

Template 5: CI Configuration with Affected

# .github/workflows/ci.yml
name: CI

on:
  push:
    branches: [main]
  pull_request:
    branches: [main]

env:
  NX_CLOUD_ACCESS_TOKEN: ${{ secrets.NX_CLOUD_ACCESS_TOKEN }}

jobs:
  main:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
        with:
          fetch-depth: 0

      - uses: actions/setup-node@v4
        with:
          node-version: 20
          cache: 'npm'

      - name: Install dependencies
        run: npm ci

      - name: Derive SHAs for affected commands
        uses: nrwl/nx-set-shas@v4

      - name: Run affected lint
        run:      

          
               

          
              

          
              

Template 6: Remote Caching Setup

// nx.json with Nx Cloud
{
  "tasksRunnerOptions": {
    "default": {
      "runner": "nx-cloud",
      "options": {
        "cacheableOperations": ["build", "lint", "test", "e2e"],
        "accessToken": "your-nx-cloud-token",
        "parallel": 3,
        "cacheDirectory": ".nx/cache"
      }
    }
  },
  "nxCloudAccessToken": "your-nx-cloud-token"
}

// Self-hosted cache with S3
{
  "tasksRunnerOptions": {
    "default": {
      "runner": "@nx-aws-cache/nx-aws-cache",
      "options": {
        "cacheableOperations": ["build", "lint", "test"],
        "awsRegion": "us-east-1",
        "awsBucket": "my-nx-cache-bucket",
        "awsProfile": "default"
      }
    }
  }
}

Common Commands

# Generate new library
nx g @nx/react:lib feature-auth --directory=libs/web --tags=type:feature,scope:web

# Run affected tests
nx affected -t test --base=main

# View dependency graph
nx graph

# Run specific project
nx build web --configuration=production

# Reset cache
nx reset

# Run migrations
nx migrate latest
nx migrate --run-migrations

Best Practices

Do's

• Use tags consistently - Enforce with module boundaries
• Enable caching early - Significant CI savings
• Keep libs focused - Single responsibility
• Use generators - Ensure consistency
• Document boundaries - Help new developers

Don'ts

• Don't create circular deps - Graph should be acyclic
• Don't skip affected - Test only what changed
• Don't ignore boundaries - Tech debt accumulates
• Don't over-granularize - Balance lib count

Resources

• Nx Documentation
• Module Boundaries
• Nx Cloud

Diff History

• v00.33.0: Ingested from antigravity-awesome-skills community repo

---

Why This Skill Exists

Use —

When to Use

Use this skill when the task requires nx workspace patterns capabilities.

What If Fails

• condition: Recurso ou ferramenta necessária indisponível