Skip to content

Instantly share code, notes, and snippets.

@bennadel
Created July 4, 2017 22:20
Show Gist options
  • Star 2 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save bennadel/71eb3670ccf51daabf1658fb13b337b1 to your computer and use it in GitHub Desktop.
Save bennadel/71eb3670ccf51daabf1658fb13b337b1 to your computer and use it in GitHub Desktop.
Using Chalk 2.0's Tagged Template Literals For Nested And Complex Styling
// Require the core node modules.
var chalk = require( "chalk" );
// ----------------------------------------------------------------------------------- //
// ----------------------------------------------------------------------------------- //
// Try using plain-old interpolation.
// --
// CAUTION: Will not work as hoped, "reset" bleeds into rest of string.
console.log( chalk.dim.underline( `Alpha ${ chalk.reset.bold.red( 'Beta' ) } Charlie` ) );
// Try using nested invocations.
// --
// CAUTION: Will not work as hoped, "reset" bleeds into rest of string.
console.log( chalk.dim.underline( "Alpha", chalk.reset.bold.red( "Beta" ), "Charlie" ) );
// Try using NEW tagged templates (in v2.0) with embedded blocks.
console.log( chalk`{dim.underline Alpha {reset.bold.red Beta} Charlie}` );
// Try using NEW tagged templates with interpolated block values.
// --
// CAUTION: This will not work because interpolated "{" "}" characters are escaped (as
// documented in the Chalk read-me).
var embedded = "{reset.bold.red Beta}";
console.log( chalk`{dim.underline Alpha ${ embedded } Charlie}` );
// Require the core node modules.
var chalk = require( "chalk" );
// ----------------------------------------------------------------------------------- //
// ----------------------------------------------------------------------------------- //
// Here is our proxy to the chalk() template method.
function chalkish( parts, ...substitutions ) {
var rawResults = [];
var cookedResults = [];
var partsLength = parts.length;
var substitutionsLength = substitutions.length;
for ( var i = 0 ; i < partsLength ; i++ ) {
rawResults.push( parts.raw[ i ] );
cookedResults.push( parts[ i ] );
if ( i < substitutionsLength ) {
rawResults.push( substitutions[ i ] );
cookedResults.push( substitutions[ i ] );
}
}
// Now that we have all the template parts and the value substitutions from the
// original string, we can build the SINGLE value that we pass onto chalk. This
// will cause chalk to evaluate the original template as if it were a static
// string (rather than a set of value substitutions).
var chalkParts = [ cookedResults.join( "" ) ];
chalkParts.raw = [ rawResults.join( "" ) ];
return( chalk( chalkParts ) );
}
// ----------------------------------------------------------------------------------- //
// ----------------------------------------------------------------------------------- //
var embedded = "{reset.bold.red Beta}";
console.log( chalkish`{dim.underline Alpha ${ embedded } Charlie}` );
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment