How to colorize the errors in tsc output?
Asked Answered
N

2

13

When developing a typescript project I run the compiler in watch mode:

tsc --watch

Yet when an error appears, I find it hard to discern in the output as I have plain formatted text:

error output of tsc: <code>src/core/SnowWhite/Cruise/SnowWhiteCruiseClient.ts(10,52): error TS2304: Cannot find name 'favfav'.</code>

Often time I don't even read it, as there are multiple outputs from previous runs.

I currently am trying to ease my pain by grepping for errors in order to mark those line in red:

tsc -w | egrep --color '.*error.*|$'

yet that feels hackish. Is there a more easy way to get errors printed out nicely in typescript?

Naevus answered 19/12, 2016 at 12:50 Comment(0)
N
20

TypeScript supports multiple compiler options, and one of them is pretty:

Stylize errors and messages using color and context.

Alas, it defaults to false so you have to enable it in your .tsconfig:

{
    "compilerOptions": {
        "pretty": true
    }
}

Then you get colors and more context information:

Screenshot of tsc with pretty enabled to provide colors and more context on errors

Naevus answered 19/12, 2016 at 12:50 Comment(1)
Thanks. "pretty" now defaults to true. Unless piping to another program or redirecting output to a file. typescriptlang.org/docs/handbook/compiler-options.htmlCondyloma
F
0

You can use --pretty to ensure that the error messages piped into another command or dumped into a file get colors and other nice treatment:

tsc --pretty | egrep --color '.*error.*|$'

# or, if you prefer to dump to a file and read from it:
tsc --pretty > errs.txt
less -R errs.txt
Fadil answered 20/8, 2021 at 3:59 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.