feat(config): enhance development experience with strict linting and types
- Update ESLint configuration with strict React/TypeScript rules - Enhance TypeScript configuration with stricter checks - Add comprehensive type definitions and exports - Update App.tsx with new routing and layout integration - Create showcase pages for component development - Improve package.json with proper dependencies Configuration ensures code quality and developer productivity with zero-tolerance for type errors and consistent code standards. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -79,11 +79,11 @@ export default tseslint.config(
|
||||
},
|
||||
},
|
||||
rules: {
|
||||
// React Rules
|
||||
// React Rules - Strict Configuration
|
||||
...react.configs.recommended.rules,
|
||||
...react.configs['jsx-runtime'].rules,
|
||||
...reactHooks.configs.recommended.rules,
|
||||
...jsxA11y.configs.recommended.rules,
|
||||
...jsxA11y.configs.strict.rules,
|
||||
|
||||
// React Refresh
|
||||
'react-refresh/only-export-components': [
|
||||
@@ -122,11 +122,27 @@ export default tseslint.config(
|
||||
},
|
||||
],
|
||||
'react/jsx-pascal-case': ['error', { allowAllCaps: true }],
|
||||
'react/no-array-index-key': 'off', // Allow index keys for static lists
|
||||
'react/no-array-index-key': 'warn', // Warn about index keys - use stable IDs when possible
|
||||
'react/no-danger': 'error',
|
||||
'react/no-deprecated': 'error',
|
||||
'react/no-unsafe': 'error',
|
||||
'react/hook-use-state': 'warn',
|
||||
'react-hooks/exhaustive-deps': 'error', // Strict enforcement of exhaustive deps
|
||||
'react/display-name': 'error', // All components must have display names
|
||||
|
||||
// Accessibility - Additional Strict Rules
|
||||
'jsx-a11y/no-autofocus': ['error', { ignoreNonDOM: true }],
|
||||
'jsx-a11y/anchor-is-valid': 'error',
|
||||
'jsx-a11y/click-events-have-key-events': 'error',
|
||||
'jsx-a11y/interactive-supports-focus': 'error',
|
||||
'jsx-a11y/label-has-associated-control': 'error',
|
||||
'jsx-a11y/media-has-caption': 'error',
|
||||
'jsx-a11y/no-static-element-interactions': 'error',
|
||||
'jsx-a11y/role-has-required-aria-props': 'error',
|
||||
'jsx-a11y/role-supports-aria-props': 'error',
|
||||
'jsx-a11y/scope': 'error',
|
||||
'jsx-a11y/heading-has-content': 'error',
|
||||
'jsx-a11y/img-redundant-alt': 'error',
|
||||
|
||||
// TypeScript Rules
|
||||
'@typescript-eslint/no-unused-vars': [
|
||||
@@ -148,12 +164,22 @@ export default tseslint.config(
|
||||
'@typescript-eslint/no-unused-expressions': 'error',
|
||||
'@typescript-eslint/prefer-readonly': 'warn',
|
||||
'@typescript-eslint/explicit-function-return-type': [
|
||||
'off', // Let TypeScript infer return types for React components
|
||||
'warn', // Enforce explicit return types for better documentation
|
||||
{
|
||||
allowExpressions: true,
|
||||
allowTypedFunctionExpressions: true,
|
||||
allowHigherOrderFunctions: true,
|
||||
allowDirectConstAssertionInArrowFunctions: true,
|
||||
allowConciseArrowFunctionExpressionsStartingWithVoid: true,
|
||||
},
|
||||
],
|
||||
'@typescript-eslint/explicit-module-boundary-types': [
|
||||
'warn',
|
||||
{
|
||||
allowArgumentsExplicitlyTypedAsAny: false,
|
||||
allowDirectConstAssertionInArrowFunctions: true,
|
||||
allowHigherOrderFunctions: true,
|
||||
allowTypedFunctionExpressions: true,
|
||||
},
|
||||
],
|
||||
'@typescript-eslint/consistent-type-imports': [
|
||||
@@ -216,8 +242,11 @@ export default tseslint.config(
|
||||
'import/default': 'off', // React 18 JSX transform doesn't export default
|
||||
'import/export': 'error',
|
||||
|
||||
// General Code Quality
|
||||
'no-console': ['warn', { allow: ['warn', 'error'] }],
|
||||
// General Code Quality - Strict Rules
|
||||
'no-console': process.env.NODE_ENV === 'production'
|
||||
? ['error', { allow: ['warn', 'error'] }]
|
||||
: ['warn', { allow: ['warn', 'error', 'info'] }],
|
||||
'prefer-const': 'error',
|
||||
'no-debugger': 'error',
|
||||
'no-alert': 'error',
|
||||
'no-var': 'error',
|
||||
@@ -248,7 +277,7 @@ export default tseslint.config(
|
||||
'no-async-promise-executor': 'error',
|
||||
'no-await-in-loop': 'warn',
|
||||
|
||||
// Naming Conventions
|
||||
// Naming Conventions - Strict Standards
|
||||
'@typescript-eslint/naming-convention': [
|
||||
'error',
|
||||
{
|
||||
@@ -268,6 +297,15 @@ export default tseslint.config(
|
||||
selector: 'interface',
|
||||
format: ['PascalCase'],
|
||||
},
|
||||
{
|
||||
selector: 'interface',
|
||||
filter: {
|
||||
regex: '^.*Props$',
|
||||
match: true,
|
||||
},
|
||||
format: ['PascalCase'],
|
||||
suffix: ['Props'],
|
||||
},
|
||||
{
|
||||
selector: 'typeAlias',
|
||||
format: ['PascalCase'],
|
||||
@@ -276,6 +314,10 @@ export default tseslint.config(
|
||||
selector: 'enum',
|
||||
format: ['PascalCase'],
|
||||
},
|
||||
{
|
||||
selector: 'enumMember',
|
||||
format: ['UPPER_CASE'],
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
@@ -320,11 +362,11 @@ export default tseslint.config(
|
||||
},
|
||||
},
|
||||
rules: {
|
||||
// React Rules
|
||||
// React Rules - Strict Configuration
|
||||
...react.configs.recommended.rules,
|
||||
...react.configs['jsx-runtime'].rules,
|
||||
...reactHooks.configs.recommended.rules,
|
||||
...jsxA11y.configs.recommended.rules,
|
||||
...jsxA11y.configs.strict.rules,
|
||||
|
||||
// React Refresh
|
||||
'react-refresh/only-export-components': [
|
||||
@@ -355,13 +397,16 @@ export default tseslint.config(
|
||||
},
|
||||
],
|
||||
'react/jsx-pascal-case': ['error', { allowAllCaps: true }],
|
||||
'react/no-array-index-key': 'off', // Allow index keys for static lists
|
||||
'react/no-array-index-key': 'warn', // Warn about index keys - use stable IDs when possible
|
||||
'react/no-danger': 'error',
|
||||
'react/no-deprecated': 'error',
|
||||
'react/no-unsafe': 'error',
|
||||
|
||||
// General Code Quality
|
||||
'no-console': ['warn', { allow: ['warn', 'error'] }],
|
||||
// General Code Quality - Strict Rules
|
||||
'no-console': process.env.NODE_ENV === 'production'
|
||||
? ['error', { allow: ['warn', 'error'] }]
|
||||
: ['warn', { allow: ['warn', 'error', 'info'] }],
|
||||
'prefer-const': 'error',
|
||||
'no-debugger': 'error',
|
||||
'no-alert': 'error',
|
||||
'no-var': 'error',
|
||||
|
||||
Reference in New Issue
Block a user