managarten/packages/eslint-config/typescript.js
Wuesteon aab8c73a9c feat: add multi-layered runtime config protection system
Add comprehensive defense system to prevent runtime config bugs across all projects:

## 1. Enhanced ESLint Rules
- Added @typescript-eslint/no-floating-promises (error)
  Catches: fetch(`${getAuthUrl()}/api`) without await
- Added @typescript-eslint/no-misused-promises (error)
  Catches: Promises in conditionals and logical expressions
- Added @typescript-eslint/require-await (warn)
  Ensures async functions actually use await

## 2. Validation Script (scripts/validate-runtime-config.mjs)
Automated checker that scans all web apps for:
-  Required files (runtime.ts, docker-entrypoint.sh, Dockerfile)
-  Window injection patterns (window.__PUBLIC_*)
-  Build-time env usage in stores/api (import.meta.env.PUBLIC_*)
-  Missing await on async config functions
- ⚠️  Docker entrypoint best practices

Usage: pnpm validate:runtime-config

## 3. Comprehensive Documentation (docs/RUNTIME_CONFIG.md)
Complete implementation guide covering:
- Why runtime configuration is needed
- Step-by-step implementation guide
- Common patterns (API clients, auth stores)
- Anti-patterns to avoid
- Migration checklist
- ESLint protection details

## Benefits
- Prevents "[object Promise]" in API URLs (staging bug)
- Catches missing await at lint time
- Validates all apps automatically
- Clear documentation for new projects
- Can run in CI/CD

## Future Work
- Add to pre-push hook (optional)
- Create project generator/template
- Shared runtime config package

This prevents the class of bugs we just fixed in manacore-web where
getAuthUrl() was called without await, causing ERR_CONNECTION_REFUSED
on staging.
2025-12-16 00:28:57 +01:00

123 lines
3.6 KiB
JavaScript

/**
* TypeScript ESLint configuration
*
* Provides type-aware linting rules for TypeScript projects.
* Uses projectService for automatic tsconfig detection in monorepos.
*
* Strictness balance:
* - ERROR: Unused variables, unsafe operations
* - WARN: Explicit any (allow during migration), return types
* - OFF: Rules that conflict with TypeScript's own checks
*/
import tseslint from 'typescript-eslint';
/** @type {import('eslint').Linter.Config[]} */
export const typescriptConfig = [
...tseslint.configs.recommended,
{
files: ['**/*.ts', '**/*.tsx', '**/*.mts', '**/*.cts'],
languageOptions: {
parser: tseslint.parser,
parserOptions: {
ecmaVersion: 2022,
sourceType: 'module',
projectService: true,
tsconfigRootDir: import.meta.dirname,
},
},
plugins: {
'@typescript-eslint': tseslint.plugin,
},
rules: {
// ============================================
// ERRORS - Type safety violations
// ============================================
// Unused code must be removed
'@typescript-eslint/no-unused-vars': [
'error',
{
argsIgnorePattern: '^_',
varsIgnorePattern: '^_',
caughtErrorsIgnorePattern: '^_',
ignoreRestSiblings: true,
},
],
// Enforce proper typing
'@typescript-eslint/no-non-null-assertion': 'warn',
// ============================================
// ASYNC/AWAIT - Prevent runtime config bugs
// ============================================
// CRITICAL: Prevent calling async functions without await
// This catches bugs like: `fetch(\`\${getAuthUrl()}/api\`)` instead of `fetch(\`\${await getAuthUrl()}/api\`)`
'@typescript-eslint/no-floating-promises': [
'error',
{
ignoreVoid: true,
ignoreIIFE: true,
},
],
// Prevent misused promises in conditionals/logical expressions
'@typescript-eslint/no-misused-promises': [
'error',
{
checksVoidReturn: false, // Allow async functions in event handlers
checksConditionals: true,
},
],
// Require await in async functions (otherwise why is it async?)
'@typescript-eslint/require-await': 'warn',
// Prevent returning values from Promise executor
'@typescript-eslint/no-misused-new': 'error',
// ============================================
// WARNINGS - Best practices, fix when convenient
// ============================================
// Allow any during migration, but flag it
'@typescript-eslint/no-explicit-any': 'warn',
// Encourage type annotations on exports
'@typescript-eslint/explicit-function-return-type': 'off', // Too verbose
'@typescript-eslint/explicit-module-boundary-types': 'off', // Too verbose
// Prefer modern patterns
'@typescript-eslint/prefer-as-const': 'warn',
'@typescript-eslint/no-inferrable-types': 'warn',
'@typescript-eslint/consistent-type-imports': [
'warn',
{
prefer: 'type-imports',
fixStyle: 'inline-type-imports',
},
],
// ============================================
// OFF - Too strict or handled elsewhere
// ============================================
// Allow empty functions (common in interfaces/defaults)
'@typescript-eslint/no-empty-function': 'off',
// Allow require() for dynamic imports
'@typescript-eslint/no-require-imports': 'off',
// Allow namespace for declaration merging
'@typescript-eslint/no-namespace': 'off',
// Base rule must be off when using TS version
'no-unused-vars': 'off',
// Allow this aliasing in some patterns (e.g., closures)
'@typescript-eslint/no-this-alias': 'warn',
},
},
];
export default typescriptConfig;