Template Literal Types

Unit String Values

Template literal types can model values that combine a number and a unit suffix.

Unit String Values

units.ts 
type CssUnit = "px" | "rem";
type CssSize = `${number}${CssUnit}`;

function styleLine(size: CssSize): string {
    return `font-size=${size}`;
}

const unit: CssUnit = ;
const amount: number = 14;
const size: CssSize = `${amount}${unit}`;

console.log(styleLine(size));

type CssUnit = "px" | "rem";
type CssSize = `${number}${CssUnit}`;

function styleLine(size: CssSize): string {
    return `font-size=${size}`;
}

const unit: CssUnit = ;
const amount: number = 14;
const size: CssSize = `${amount}${unit}`;

console.log(styleLine(size));
unit string A type such as `` `${number}px` `` accepts many numeric strings while still requiring a unit.