@babel/code-frame

    1. const rawLines = `class Foo {
    2. constructor()
    3. }`;
    4. const location = { start: { line: 2, column: 16 } };
    5. const result = codeFrameColumns(rawLines, location, { /* options */ });
    6. console.log(result);

    You can also pass an end hash in location.

    1. import { codeFrameColumns } from '@babel/code-frame';
    2. const rawLines = `class Foo {
    3. constructor() {
    4. console.log("hello");
    5. }`;
    6. const location = { start: { line: 2, column: 17 }, end: { line: 4, column: 3 } };
    7. const result = codeFrameColumns(rawLines, location, { /* options */ });
    8. console.log(result);

    boolean, defaults to false.

    Toggles syntax highlighting the code as JavaScript for terminals.

    number, defaults to 2.

    number, defaults to 3.

    Adjust the number of lines to show below the error.

    boolean, defaults to false.

    Enable this to forcibly syntax highlight the code as JavaScript (for non-terminals); overrides highlightCode.

    Pass in a string to be displayed inline (if possible) next to the highlightedlocation in the code. If it can't be positioned inline, it will be placed abovethe code frame.

    1. > 2 | constructor()
    2. | ^ Missing {
    3. 3 | };

    Prior to version 7, the only API exposed by this module was for a single line and optional column pointer. The old API will now log a deprecation warning.

    The new API takes a location object, similar to what is available in an AST.

    This is an example of the deprecated (but still available) API:

    1. import { codeFrameColumns } from '@babel/code-frame';
    2. const rawLines = `class Foo {
    3. constructor() {
    4. console.log("hello");
    5. }
    6. }`;
    7. const location = { start: { line: 2, column: 16 } };
    8. const result = codeFrameColumns(rawLines, location, { /* options */ });
    9. console.log(result);