{"id":18974,"library":"awesome-code-frame","title":"awesome-code-frame","description":"A fork of @babel/code-frame that provides code frame generation for error messages, using updated dependencies like chalk 5 and exported as pure ESM. Current version 1.1.0 offers the same API as @babel/code-frame but with modernized internals and TypeScript support. It is maintained, with no active development. Key differentiator: drops CommonJS support entirely, requiring Node 14.13.1+ and ESM-only environment; uses latest chalk for terminal colors, which can break Jest and other CJS-based tooling.","status":"active","version":"1.1.0","language":"javascript","source_language":"en","source_url":"https://github.com/grantila/awesome-code-frame","tags":["javascript","code","frame","babel","awesome","typescript"],"install":[{"cmd":"npm install awesome-code-frame","lang":"bash","label":"npm"},{"cmd":"yarn add awesome-code-frame","lang":"bash","label":"yarn"},{"cmd":"pnpm add awesome-code-frame","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Chalk 5+ is a peer dependency; package uses latest chalk which is ESM-only and causes issues with Jest","package":"chalk","optional":false}],"imports":[{"note":"Package is pure ESM; require() will throw ERR_REQUIRE_ESM","wrong":"const { codeFrameColumns } = require('awesome-code-frame')","symbol":"codeFrameColumns","correct":"import { codeFrameColumns } from 'awesome-code-frame'"},{"note":"NodeLocation is a TypeScript type; use import type to avoid runtime errors","wrong":"import { NodeLocation } from 'awesome-code-frame'","symbol":"type NodeLocation","correct":"import type { NodeLocation } from 'awesome-code-frame'"},{"note":"Options is a TypeScript interface; value import not possible","wrong":"const Options = require('awesome-code-frame').Options","symbol":"type Options","correct":"import type { Options } from 'awesome-code-frame'"}],"quickstart":{"code":"import { codeFrameColumns } from 'awesome-code-frame';\n\nconst rawLines = `function add(a, b) {\n  return a + b\n}`;\n\nconst location = {\n  start: { line: 1, column: 10 },\n  end: { line: 2, column: 15 }\n};\n\nconst result = codeFrameColumns(rawLines, location, {\n  highlightCode: true,\n  message: 'Something wrong here'\n});\n\nconsole.log(result);","lang":"typescript","description":"Shows basic usage of codeFrameColumns with a sample code snippet, location, and options."},"warnings":[{"fix":"Use import() dynamic import or switch to ESM in your project","message":"Package is pure ESM; CommonJS require() will fail with ERR_REQUIRE_ESM","severity":"breaking","affected_versions":">=1.0.0"},{"fix":"Set transformIgnorePatterns to allow transforming awesome-code-frame and chalk, or use jest-environment-jsdom with custom transform","message":"Jest may fail due to ESM issues with chalk; see chalk issue #532","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Upgrade Node to >=14.13.1 or >=16.0.0","message":"The highlightCode option uses chalk internally; chalk 5+ dropped CJS support, causing issues in Node <14.13.1","severity":"deprecated","affected_versions":">=1.0.0"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Use import { codeFrameColumns } from 'awesome-code-frame' instead of require()","cause":"Package is pure ESM but you used require()","error":"Error [ERR_REQUIRE_ESM]: require() of ES Module /path/to/awesome-code-frame/index.mjs not supported."},{"fix":"Run npm install chalk or add chalk to your dependencies","cause":"Chalk is a peer dependency and not installed automatically","error":"Cannot find module 'chalk' or Your application tried to access chalk while it is not a dependency."},{"fix":"Add 'awesome-code-frame' to transformIgnorePatterns exception: 'transformIgnorePatterns: [\"node_modules/(?!(awesome-code-frame|chalk)/)\"]'","cause":"Jest does not transform ESM modules by default","error":"Jest encountered an unexpected token - SyntaxError: Cannot use import statement outside a module"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}