How to colorize the errors in tsc output?

Question

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:

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?

Answer 1

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:

Answer 2

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