Registry / testing / awesome-code-frame

awesome-code-frame

library1.1.0jsnpmunverified

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.

testing

npm install awesome-code-frame

github ↗package ↗

INSTALL

IMPORT

SIG · AWESOME-CODE-FRAME

awesome-code-frame

testingjavascriptv1.1.0

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

codeFrameColumns

✓ import { codeFrameColumns } from 'awesome-code-frame'

✗ const { codeFrameColumns } = require('awesome-code-frame')

Package is pure ESM; require() will throw ERR_REQUIRE_ESM

type NodeLocation

✓ import type { NodeLocation } from 'awesome-code-frame'

✗ import { NodeLocation } from 'awesome-code-frame'

NodeLocation is a TypeScript type; use import type to avoid runtime errors

type Options

✓ import type { Options } from 'awesome-code-frame'

✗ const Options = require('awesome-code-frame').Options

Options is a TypeScript interface; value import not possible

Shows basic usage of codeFrameColumns with a sample code snippet, location, and options.

import { codeFrameColumns } from 'awesome-code-frame'; const rawLines = `function add(a, b) { return a + b }`; const location = { start: { line: 1, column: 10 }, end: { line: 2, column: 15 } }; const result = codeFrameColumns(rawLines, location, { highlightCode: true, message: 'Something wrong here' }); console.log(result);

Debug

Known issues

breakingPackage is pure ESM; CommonJS require() will fail with ERR_REQUIRE_ESM

fix

Use import() dynamic import or switch to ESM in your project

affects: >=1.0.0

gotchaJest may fail due to ESM issues with chalk; see chalk issue #532

fix

Set transformIgnorePatterns to allow transforming awesome-code-frame and chalk, or use jest-environment-jsdom with custom transform

affects: >=1.0.0

deprecatedThe highlightCode option uses chalk internally; chalk 5+ dropped CJS support, causing issues in Node <14.13.1

fix

Upgrade Node to >=14.13.1 or >=16.0.0

affects: >=1.0.0

Errors

Common errors & fixes

Error [ERR_REQUIRE_ESM]: require() of ES Module /path/to/awesome-code-frame/index.mjs not supported.

Package is pure ESM but you used require()

fix

Use import { codeFrameColumns } from 'awesome-code-frame' instead of require()

Cannot find module 'chalk' or Your application tried to access chalk while it is not a dependency.

Chalk is a peer dependency and not installed automatically

fix

Run npm install chalk or add chalk to your dependencies

Jest encountered an unexpected token - SyntaxError: Cannot use import statement outside a module

Jest does not transform ESM modules by default

fix

Add 'awesome-code-frame' to transformIgnorePatterns exception: 'transformIgnorePatterns: ["node_modules/(?!(awesome-code-frame|chalk)/)"]'

Upgrade

Version history

1.1.0latest on npm

Audit

Dependencies

chalkrequiredChalk 5+ is a peer dependency; package uses latest chalk which is ESM-only and causes issues with Jest

Agent activity

22 hits · last 30 days

node

OpenAI (training)

Resources

githubhttps://github.com/grantila/awesome-code-frame ↗

packagehttps://www.npmjs.com/package/awesome-code-frame ↗