dev-infrastructure-setup

🚀 Dev Infrastructure Setup

A shareable development infrastructure package for TypeScript/React Native/Node.js projects with ESLint, Prettier, Husky, Jest, and comprehensive AI development guidelines.

Features

✅ ESLint - TypeScript-ready linting with Prettier integration ✅ Prettier - Consistent code formatting ✅ Husky - Git hooks for pre-commit and pre-push validation ✅ Jest - Testing setup with coverage support ✅ TypeScript - Strict type checking configuration ✅ CLAUDE.md - Comprehensive AI assistant development guide ✅ NPM Scripts - Pre-configured development workflow commands

Quick Start

Installation

Run this command in your project directory:

npx @benashman/dev-infrastructure

Or if you've published it to npm:

npm install -g @benashman/dev-infrastructure
setup-dev-infra

What Gets Installed

The setup script will:

• ✅ Copy configuration files to your project root
• ✅ Add development scripts to your package.json
• ✅ Install required dev dependencies
• ✅ Set up Husky git hooks
• ✅ Create CLAUDE.md with development guidelines

Manual Installation (Alternative)

If you prefer to set up manually or the automated script doesn't work:

1. Install Dependencies

npm install --save-dev \
  @typescript-eslint/eslint-plugin@^8.20.0 \
  @typescript-eslint/parser@^8.20.0 \
  eslint@^9.18.0 \
  eslint-config-prettier@^9.1.0 \
  eslint-plugin-prettier@^5.2.1 \
  prettier@^3.4.2 \
  husky@^9.1.7 \
  lint-staged@^16.2.7 \
  @types/jest@^29.5.14 \
  jest@^29.7.0

2. Copy Configuration Files

Copy these files from the package to your project root:

• eslint.config.js
• .prettierrc
• .prettierignore
• jest.config.js
• CLAUDE.md

3. Set Up Husky

npx husky init

Then copy the pre-commit and pre-push hooks to .husky/ directory.

4. Add Scripts to package.json

{
  "scripts": {
    "typecheck": "tsc --noEmit",
    "lint": "npx eslint .",
    "lint:fix": "npx eslint . --fix",
    "format": "npx prettier --write \"**/*.{ts,tsx,js,jsx,json,md}\"",
    "format:check": "npx prettier --check \"**/*.{ts,tsx,js,jsx,json,md}\"",
    "check:all": "npm run format:check && npm run lint && npm run typecheck",
    "fix:all": "npm run format && npm run lint:fix && npm run typecheck",
    "pre-commit": "npm run format && npm run lint:fix && npm run typecheck",
    "pre-push": "npm run typecheck && npm run lint && npm run test",
    "test": "npx jest",
    "test:watch": "npx jest --watch",
    "test:coverage": "npx jest --coverage",
    "prepare": "husky"
  },
  "lint-staged": {
    "*.{ts,tsx}": [
      "npx eslint --fix",
      "npx prettier --write"
    ],
    "*.{js,jsx,json,md}": [
      "npx prettier --write"
    ]
  }
}

Available Commands

After installation, you'll have these npm scripts available:

Linting & Formatting

npm run lint           # Check for linting errors
npm run lint:fix       # Auto-fix linting errors
npm run format         # Format all files with Prettier
npm run format:check   # Check formatting without modifying files

Type Checking

npm run typecheck      # Run TypeScript type checking

Testing

npm test               # Run all tests
npm run test:watch     # Run tests in watch mode
npm run test:coverage  # Run tests with coverage report

Combined Checks

npm run check:all      # Run format check, lint, and typecheck
npm run fix:all        # Run format, lint fix, and typecheck

Git Hooks

Pre-Commit Hook

Automatically runs on every commit:

• ✅ Lints and formats only staged files (via lint-staged)
• ✅ Runs TypeScript type checking
• ⚠️ Blocks commit if checks fail

Bypass: git commit --no-verify

Pre-Push Hook

Automatically runs before every push:

• ✅ Runs full validation suite (npm run check:all)
• ✅ Runs all tests
• ⚠️ Blocks push if checks fail

Bypass: git push --no-verify

Configuration Files

ESLint (eslint.config.js)

• TypeScript support with @typescript-eslint
• Prettier integration for formatting
• Warns on console.log (allows console.warn and console.error)
• Enforces prefer-const and no var

Prettier (.prettierrc)

• Single quotes for strings
• Semicolons required
• 100 character line width
• 2-space indentation
• Trailing commas (ES5)

Jest (jest.config.js)

• Configured for React Native/Expo projects
• Path alias support (@/ → src/)
• Coverage collection from src/**/*.{ts,tsx}
• Ignores test files from coverage

TypeScript Path Aliases

Update your tsconfig.json to include:

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["./src/*"]
    }
  }
}

CLAUDE.md - AI Development Guide

The package includes a comprehensive CLAUDE.md file with:

• 📝 Project context and build commands
• 🎨 Code style guidelines (ES modules, imports, TypeScript)
• 🔧 Development workflow and pre-commit checklist
• 📋 Naming conventions (files, variables, functions, types)
• 🤖 AI assistant guidelines for working with your codebase
• 🐛 GitHub issue resolution workflow
• 🔐 Security best practices
• ⚡ Performance optimization tips
• 🛠️ Troubleshooting common issues

Customize it with your project-specific information!

Troubleshooting

Hooks Not Running

On Unix/Mac:

chmod +x .husky/pre-commit .husky/pre-push

On Windows: Hooks should work automatically. If not, ensure Git is configured:

git config core.hooksPath .husky

TypeScript Errors

Make sure your tsconfig.json includes the path aliases:

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["./src/*"]
    }
  }
}

ESLint Not Finding Files

Ensure you're running ESLint from the project root:

npx eslint .

Dependencies Not Installing

Try clearing npm cache:

npm cache clean --force
npm install

Customization

Modify ESLint Rules

Edit eslint.config.js and update the rules section:

rules: {
  'no-console': 'off', // Allow all console statements
  '@typescript-eslint/no-explicit-any': 'error', // Make 'any' an error instead of warning
}

Modify Prettier Settings

Edit .prettierrc:

{
  "singleQuote": false,  // Use double quotes
  "printWidth": 120      // Wider lines
}

Modify Git Hooks

Edit .husky/pre-commit or .husky/pre-push:

#!/bin/sh
# Add your custom validation here
npm run custom-check

Publishing Your Own Version

Want to create your own version of this package?

1. Clone and Customize

git clone <this-repo>
cd dev-setup-package
# Customize configs, scripts, CLAUDE.md

2. Update Package Name

In package.json:

{
  "name": "@yourname/dev-infrastructure",
  "version": "1.0.0"
}

3. Publish to NPM

npm login
npm publish --access public

4. Use Your Package

npx @yourname/dev-infrastructure

Project Structure

dev-setup-package/
├── bin/
│   └── setup.js           # Main setup script
├── configs/
│   ├── eslint.config.js   # ESLint configuration
│   ├── .prettierrc        # Prettier configuration
│   ├── .prettierignore    # Prettier ignore patterns
│   └── jest.config.js     # Jest configuration
├── templates/
│   ├── CLAUDE.md          # AI development guide
│   └── husky-hooks/
│       ├── pre-commit     # Pre-commit git hook
│       └── pre-push       # Pre-push git hook
├── package.json
└── README.md

Contributing

Found a bug or want to add a feature?

• Fork the repository
• Create a feature branch (git checkout -b feature/amazing-feature)
• Commit your changes (git commit -m 'feat: add amazing feature')
• Push to the branch (git push origin feature/amazing-feature)
• Open a Pull Request

License

MIT © Ben Ashman

Support

For issues or questions:

• 📧 Email: [e-mail]
• 🐛 Issues: GitHub Issues

Happy coding! 🎉