Build and Lint Verification Skill

Use this skill to ensure code compiles and passes quality checks before deployment or testing.

When to Use

• •After writing new code
• •Before committing to git
• •Before running tests
• •After fixing bugs
• •During QA validation

What This Skill Does

1. .NET Build Verification

Ensures backend code compiles:

• •Run dotnet build
• •Check for errors
• •Check for warnings
• •Verify project references

2. React Build Verification

Ensures frontend code compiles:

• •Run npm run build
• •Check for TypeScript errors
• •Check for build warnings
• •Verify bundle size

3. Linting

Enforces code quality standards:

• •Run npm run lint for React
• •Fix auto-fixable issues
• •Report remaining violations

4. Type Checking

Validates TypeScript types:

• •Run npm run type-check (if available)
• •Ensure strict mode compliance
• •No any types without justification

Testing Workflow

For .NET Projects

cd {context}/{context}-api

# Build
dotnet build

# Check output:
# ✓ Build succeeded. 0 Warning(s). 0 Error(s)
# ✗ Build FAILED. X Error(s)

# If errors, review and fix

# Run tests
dotnet test

# Check output:
# ✓ Passed! - Total: X, Passed: X, Failed: 0
# ✗ Failed! - Failed: Y

For React Projects

cd {context}/{context}-ui

# Install dependencies (if needed)
npm install

# Lint
npm run lint

# Check output:
# ✓ No linting errors
# ✗ X problems (Y errors, Z warnings)

# Fix auto-fixable
npm run lint -- --fix

# Type check (if available)
npm run type-check

# Build
npm run build

# Check output:
# ✓ built in Xs
# ✗ error TS2xxx: ...

Expected Inputs

• •Project directory path
• •Project type (.NET or React)

Deliverables

• •Build status (success/failure)
• •Error count
• •Warning count
• •List of issues (if any)
• •Recommendations for fixes

Quality Standards

.NET Quality Standards

• •0 Errors: Code must compile
• •0 Warnings: All warnings fixed
• •All tests pass: 100% pass rate
• •No vulnerable packages: Run dotnet list package --vulnerable

React Quality Standards

• •0 Linting errors: All ESLint rules pass
• •0 Type errors: TypeScript strict mode compliant
• •Build succeeds: Production build completes
• •Bundle size acceptable: < 200KB gzipped for microfrontends

Automated Fix Attempts

ESLint Auto-fix

npm run lint -- --fix

Fixes:

• •Missing semicolons
• •Spacing/indentation
• •Import order
• •Unused imports

Manual Fix Required

• •TypeScript type errors
• •Logical errors
• •Security vulnerabilities
• •Performance issues

Validation Checklist

.NET Validation

• • dotnet build succeeds
• • 0 compilation errors
• • 0 compilation warnings
• • dotnet test all pass
• • No vulnerable packages
• • Code follows Clean Architecture

React Validation

• • npm run lint passes
• • npm run type-check passes (if available)
• • npm run build succeeds
• • 0 TypeScript errors
• • 0 ESLint errors
• • Bundle size acceptable
• • No console warnings in build

Example: Full Verification Flow

Backend Verification

#!/bin/bash
PROJECT_DIR="scheduling/scheduling-api"

echo "Verifying $PROJECT_DIR..."

cd $PROJECT_DIR

# Build
echo "Building..."
if dotnet build --no-incremental > build.log 2>&1; then
  echo "✓ Build succeeded"
else
  echo "✗ Build failed"
  cat build.log
  exit 1
fi

# Test
echo "Testing..."
if dotnet test > test.log 2>&1; then
  echo "✓ Tests passed"
else
  echo "✗ Tests failed"
  cat test.log
  exit 1
fi

# Check vulnerabilities
echo "Checking for vulnerabilities..."
dotnet list package --vulnerable

echo "✓ All checks passed!"

Frontend Verification

#!/bin/bash
PROJECT_DIR="scheduling/scheduling-ui"

echo "Verifying $PROJECT_DIR..."

cd $PROJECT_DIR

# Lint
echo "Linting..."
if npm run lint > lint.log 2>&1; then
  echo "✓ Lint passed"
else
  echo "⚠ Lint failed, attempting auto-fix..."
  npm run lint -- --fix
  if npm run lint > lint-fixed.log 2>&1; then
    echo "✓ Lint passed after auto-fix"
  else
    echo "✗ Lint failed after auto-fix"
    cat lint-fixed.log
    exit 1
  fi
fi

# Type check
if command -v npm run type-check &> /dev/null; then
  echo "Type checking..."
  if npm run type-check > typecheck.log 2>&1; then
    echo "✓ Type check passed"
  else
    echo "✗ Type check failed"
    cat typecheck.log
    exit 1
  fi
fi

# Build
echo "Building..."
if npm run build > build.log 2>&1; then
  echo "✓ Build succeeded"

  # Check bundle size
  BUNDLE_SIZE=$(du -sh dist | cut -f1)
  echo "Bundle size: $BUNDLE_SIZE"
else
  echo "✗ Build failed"
  cat build.log
  exit 1
fi

echo "✓ All checks passed!"

Integration with QA Agents

Before QA Frontend Testing

MUST run build and lint verification first:
1. npm run lint (must pass)
2. npm run build (must succeed)
3. Then proceed to Playwright testing

Before QA Backend Testing

MUST run build verification first:
1. dotnet build (must succeed)
2. dotnet test (must pass)
3. Then proceed to API testing

Common Issues and Fixes

Issue: ESLint errors

Common errors:

• •Unused variables
• •Missing dependencies in useEffect
• •Missing return types

Fix: Run npm run lint -- --fix first

Issue: TypeScript errors

Common errors:

• •Type 'any' not allowed
• •Property doesn't exist on type
• •Missing null checks

Fix: Add proper types, null checks

Issue: Build warnings

Common warnings:

• •Large bundle size
• •Deprecated dependencies
• •Peer dependency issues

Fix: Update dependencies, optimize imports

Issue: .NET warnings

Common warnings:

• •Unused variables
• •Nullable reference issues
• •Obsolete API usage

Fix: Clean up code, enable nullable reference types

This skill ensures code quality and prevents broken code from reaching testing or deployment.