or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

configuration.mdformatting-rules.mdindex.mdrequirement-rules.mdutilities.mdvalidation-rules.md
tile.json

configuration.mddocs/

Plugin Configuration

Predefined ESLint configurations and settings for Flow type checking integration, including recommended rule sets and parser configuration.

Capabilities

Recommended Configuration

A predefined ESLint configuration that provides sensible defaults for Flow type checking.

const configs = {
  recommended: ESLintConfig
};

interface ESLintConfig {
  parser: string;
  parserOptions: ParserOptions;
  plugins: string[];
  rules: RulesConfiguration;
  settings: PluginSettings;
}

Usage Examples:

// .eslintrc.js - using recommended config
module.exports = {
  extends: ['plugin:flowtype/recommended']
};

// Equivalent to manual configuration:
module.exports = {
  parser: '@babel/eslint-parser',
  parserOptions: {
    babelOptions: {
      plugins: [
        '@babel/plugin-transform-react-jsx',
        '@babel/plugin-syntax-flow'
      ]
    }
  },
  plugins: ['flowtype'],
  rules: {
    'flowtype/boolean-style': [2, 'boolean'],
    'flowtype/define-flow-type': 1,
    'flowtype/generic-spacing': [2, 'never'],
    'flowtype/no-types-missing-file-annotation': 2,
    'flowtype/space-after-type-colon': [2, 'always'],
    'flowtype/space-before-generic-bracket': [2, 'never'],
    'flowtype/space-before-type-colon': [2, 'never'],
    'flowtype/union-intersection-spacing': [2, 'always'],
    'flowtype/use-flow-type': 1
  },
  settings: {
    flowtype: {
      onlyFilesWithFlowAnnotation: false
    }
  }
};

Parser Configuration

Configuration for the Babel ESLint parser required for Flow syntax support.

interface ParserOptions {
  babelOptions: BabelOptions;
}

interface BabelOptions {
  plugins: string[];
}

// Required babel plugins
const requiredPlugins = [
  '@babel/plugin-transform-react-jsx',
  '@babel/plugin-syntax-flow'
];

Usage Examples:

// Minimal parser configuration for Flow
module.exports = {
  parser: '@babel/eslint-parser',
  parserOptions: {
    babelOptions: {
      plugins: [
        '@babel/plugin-syntax-flow'  // Required for Flow syntax
      ]
    }
  }
};

// Full configuration with React support
module.exports = {
  parser: '@babel/eslint-parser',
  parserOptions: {
    requireConfigFile: false,
    babelOptions: {
      plugins: [
        '@babel/plugin-syntax-flow',
        '@babel/plugin-transform-react-jsx'
      ]
    }
  }
};

Plugin Settings

Settings that control how the flowtype plugin behaves across all rules.

interface PluginSettings {
  flowtype: FlowtypeSettings;
}

interface FlowtypeSettings {
  onlyFilesWithFlowAnnotation?: boolean;
}

Usage Examples:

// Only check files with @flow annotation
module.exports = {
  settings: {
    flowtype: {
      onlyFilesWithFlowAnnotation: true
    }
  }
};

// With this setting:
// ✓ Checked - has @flow annotation
// @flow
type User = {name: string};

// ✗ Not checked - no @flow annotation
type Product = {id: number};

// Check all JavaScript files (default)
module.exports = {
  settings: {
    flowtype: {
      onlyFilesWithFlowAnnotation: false
    }
  }
};

Rule Configuration Options

Configuration patterns for individual rules with various option formats.

interface RulesConfiguration {
  [ruleName: string]: RuleConfiguration;
}

type RuleConfiguration = 
  | RuleLevel
  | [RuleLevel]
  | [RuleLevel, RuleOptions];

type RuleLevel = 0 | 1 | 2 | 'off' | 'warn' | 'error';
type RuleOptions = any;

Usage Examples:

// Different rule configuration formats
module.exports = {
  rules: {
    // Simple on/off
    'flowtype/define-flow-type': 'warn',
    'flowtype/use-flow-type': 1,
    'flowtype/no-mixed': 'off',
    
    // With options
    'flowtype/boolean-style': ['error', 'boolean'],
    'flowtype/generic-spacing': [2, 'never'],
    'flowtype/quotes': ['warn', 'single'],
    
    // Complex options
    'flowtype/require-return-type': ['error', {
      'annotateUndefined': 'never',
      'excludeArrowFunctions': true
    }],
    
    'flowtype/space-after-type-colon': ['error', 'always', {
      'allowLineBreak': false
    }]
  }
};

Default Rule Configuration

The default configuration values used by the plugin when rules are not explicitly configured.

const rulesConfig = {
  'boolean-style': 0,
  'define-flow-type': 0,
  'delimiter-dangle': 0,
  'generic-spacing': 0,
  'interface-id-match': 0,
  'newline-after-flow-annotation': 0,
  'no-dupe-keys': 0,
  'no-duplicate-type-union-intersection-members': 0,
  'no-flow-fix-me-comments': 0,
  'no-mixed': 0,
  'no-mutable-array': 0,
  'no-weak-types': 0,
  'object-type-curly-spacing': 0,
  'object-type-delimiter': 0,
  'quotes': 0,
  'require-compound-type-alias': 0,
  'require-exact-type': 0,
  'require-parameter-type': 0,
  'require-readonly-react-props': 0,
  'require-return-type': 0,
  'require-variable-type': 0,
  'semi': 0,
  'sort-keys': 0,
  'sort-type-union-intersection-members': 0,
  'space-after-type-colon': 0,
  'space-before-generic-bracket': 0,
  'space-before-type-colon': 0,
  'spread-exact-type': 0,
  'type-id-match': 0,
  'type-import-style': 0,
  'union-intersection-spacing': 0,
  'use-flow-type': 0,
  'valid-syntax': 0
};

Integration with Other Plugins

How to integrate flowtype plugin with other ESLint plugins and configurations.

interface ExtendedConfiguration {
  extends: string[];
  plugins: string[];
  rules: RulesConfiguration;
  overrides?: ConfigurationOverride[];
}

interface ConfigurationOverride {
  files: string[];
  rules?: RulesConfiguration;
  settings?: PluginSettings;
}

Usage Examples:

// Integration with popular ESLint configs
module.exports = {
  extends: [
    'eslint:recommended',
    '@babel/eslint-parser',
    'plugin:flowtype/recommended'
  ],
  plugins: ['flowtype', 'react'],
  rules: {
    // Override specific flowtype rules
    'flowtype/no-weak-types': ['error', {
      'any': true,
      'Object': false,
      'Function': true
    }]
  }
};

// File-specific overrides
module.exports = {
  extends: ['plugin:flowtype/recommended'],
  overrides: [
    {
      files: ['**/*.test.js'],
      rules: {
        'flowtype/require-return-type': 'off',
        'flowtype/require-parameter-type': 'off'
      }
    },
    {
      files: ['src/types/**/*.js'],
      settings: {
        flowtype: {
          onlyFilesWithFlowAnnotation: true
        }
      }
    }
  ]
};

Types

interface ConfigurationSchema {
  configs: {
    recommended: ESLintConfig;
  };
  rulesConfig: DefaultRulesConfiguration;
}

interface DefaultRulesConfiguration {
  [ruleName: string]: 0 | 1 | 2;
}

interface ESLintConfig {
  parser: '@babel/eslint-parser';
  parserOptions: ParserOptions;
  plugins: ['flowtype'];
  rules: RecommendedRules;
  settings: PluginSettings;
}

interface RecommendedRules {
  'flowtype/boolean-style': [2, 'boolean'];
  'flowtype/define-flow-type': 1;
  'flowtype/delimiter-dangle': 0;
  'flowtype/generic-spacing': [2, 'never'];
  'flowtype/no-mixed': 0;
  'flowtype/no-types-missing-file-annotation': 2;
  'flowtype/no-weak-types': 0;
  'flowtype/require-parameter-type': 0;
  'flowtype/require-readonly-react-props': 0;
  'flowtype/require-return-type': 0;
  'flowtype/require-valid-file-annotation': 0;
  'flowtype/semi': 0;
  'flowtype/space-after-type-colon': [2, 'always'];
  'flowtype/space-before-generic-bracket': [2, 'never'];
  'flowtype/space-before-type-colon': [2, 'never'];
  'flowtype/type-id-match': 0;
  'flowtype/union-intersection-spacing': [2, 'always'];
  'flowtype/use-flow-type': 1;
}