{"id":19636,"library":"eslint-formatter-codeframe","title":"eslint-formatter-codeframe","description":"This package provides ESLint's official 'codeframe' formatter, extracted from ESLint 7 as a standalone module for continued use after its removal in ESLint 8. It displays linting results with a colorful, framed code snippet showing the exact location of each problem. The current stable version is 7.32.2, matching ESLint 7's release cadence, and it is maintained by the eslint-community. Key differentiators: it's the exact same formatter as in ESLint 7, offers a more visually structured output than the default 'stylish' formatter, and can be used as a drop-in replacement with the --format flag.","status":"active","version":"7.32.2","language":"javascript","source_language":"en","source_url":"https://github.com/eslint-community/eslint-formatter-codeframe","tags":["javascript","lint","ecmascript","typescript"],"install":[{"cmd":"npm install eslint-formatter-codeframe","lang":"bash","label":"npm"},{"cmd":"yarn add eslint-formatter-codeframe","lang":"bash","label":"yarn"},{"cmd":"pnpm add eslint-formatter-codeframe","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"The package exports a single function as default export. Use ESM import for consistency with modern ESLint configs.","wrong":"const codeframe = require('eslint-formatter-codeframe')","symbol":"default","correct":"import codeframe from 'eslint-formatter-codeframe'"},{"note":"Named import is incorrect; the package only has a default export.","wrong":"import { codeframe } from 'eslint-formatter-codeframe'","symbol":"codeframe","correct":"import codeframe from 'eslint-formatter-codeframe'"},{"note":"TypeScript types are included; import the type if you need the function signature.","wrong":null,"symbol":"type FormatterFunction","correct":"import type { FormatterFunction } from 'eslint-formatter-codeframe'"}],"quickstart":{"code":"// Install: npm install --save-dev eslint-formatter-codeframe\n// Run ESLint with the codeframe formatter:\n// eslint --format codeframe *.js\n\n// Alternatively, use programmatically:\nimport codeframe from 'eslint-formatter-codeframe';\nconst results = [\n  {\n    filePath: './example.js',\n    messages: [\n      {\n        ruleId: 'no-unused-vars',\n        severity: 2,\n        message: \"'addOne' is defined but never used.\",\n        line: 1,\n        column: 10,\n        endLine: 1,\n        endColumn: 16\n      }\n    ],\n    errorCount: 1,\n    warningCount: 0,\n    fixableErrorCount: 0,\n    fixableWarningCount: 0,\n    source: 'function addOne(i) {\\n    if (i != NaN) {\\n        return i ++\\n    } else {\\n      return\\n    }\\n};\\n'\n  }\n];\nconst output = codeframe(results, {});\nconsole.log(output);","lang":"typescript","description":"Demonstrates installing, running via CLI, and programmatic usage of the codeframe formatter."},"warnings":[{"fix":"Install eslint-formatter-codeframe and use --format codeframe (it will be found automatically if installed in node_modules).","message":"This package is extracted from ESLint 7. ESLint 8+ does not include this formatter; you must install this package separately.","severity":"breaking","affected_versions":">=8.0.0"},{"fix":"Update to v7.32.2 or later.","message":"The formatter output may contain trailing '.' if preceded by a space (fixed in v7.32.2).","severity":"gotcha","affected_versions":"<7.32.2"},{"fix":"Ensure ESLint results include the 'source' field (e.g., by calling CLIEngine with .executeOnFiles(...).results).","message":"Programmatic use: the formatter expects results array with 'source' property; without it, code snippets cannot be displayed.","severity":"gotcha","affected_versions":">=7.0.0"},{"fix":"Consider using ESLint's built-in formatters or alternative community formatters for ESLint 9+ compatibility.","message":"This package is tied to ESLint 7's rule format; may not work correctly with ESLint 9 flat config or newer rule metadata.","severity":"deprecated","affected_versions":">=7.0.0"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Run npm install --save-dev eslint-formatter-codeframe","cause":"Package not installed or not in node_modules.","error":"Cannot find module 'eslint-formatter-codeframe'"},{"fix":"Ensure you pass results that include the source file content (e.g., from .executeOnFiles().results).","cause":"Programmatic usage without providing source code.","error":"Missing source property in result object"},{"fix":"Use import codeframe from 'eslint-formatter-codeframe' or const codeframe = require('eslint-formatter-codeframe').default","cause":"Incorrect import pattern (e.g., named import { codeframe }).","error":"TypeError: codeframe is not a function"},{"fix":"Install eslint-formatter-codeframe globally or ensure it is in the local node_modules when running ESLint.","cause":"ESLint cannot find the formatter; the package is not installed or ESLint is running from a different directory.","error":"Error: Invalid formatter 'codeframe'"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}