Syntax highlighting in the build/deploy logs

[seanhamlin]

At present, all the logs are just emitted out, with no interpretation of ANSI codes. This can make finding things like errors more difficult, and in general just makes the logs harder to read.

Current workaround

You can remove ANSI codes with most tooling, e.g. composer has composer --no-ansi, this strips the ANSI codes prior to printing. No colour however.

Proposal

Render the default ANSI colours into HTML so that they are viewable in the UI of Lagoon

here is an example of the ANSI codes being emitted, but not rendered:

$ NODE_ENV=production webpack --mode production --progress
�[91m<s> [webpack.Progress] 0% 
�[0m�[91m
�[0m�[91m<s> [webpack.Progress] 1% setup before run
�[0m�[91m<s> [webpack.Progress] 1% setup before run NodeEnvironmentPlugin
�[0m�[91m<s> [webpack.Progress] 1% setup before run
�[0m�[91m<s> [webpack.Progress] 2% setup run
�[0m�[91m<s> [webpack.Progress] 2% setup run webpack-cli
�[0m�[91m<s> [webpack.Progress] 2% setup run WebpackManifestPlugin
�[0m�[91m<s> [webpack.Progress] 2% setup run
�[0m�[91m<s> [webpack.Progress] 4% setup normal module factory

An example with colour

Perhaps something like https://www.npmjs.com/package/ansi-to-html could be used?

[bomoko]

we could probably use something like https://www.npmjs.com/package/ansi-to-react