How to fix Template literal type cannot contain template literal in TypeScript

If you built the inner union with another literal, expand it when building the outer literal instead of nesting the alias:

Problematic pattern:
\\\ts // Inner alias remains a template literal type type ComponentSize = \\${"small" | "large"}\; type ComponentClass = \button-\${ComponentSize}\; // Error: Template literal type cannot contain template literal \\\
Fix: inline the union or limit the alias to primitives so the outer literal sees a string union:
\\\ts type ComponentClass = \button-\${"small" | "large"}\; // Works // or give ComponentSize a plain string union type ComponentSize = "small" | "large"; type ComponentClass = \button-\${ComponentSize}\; \\\

If the placeholder comes from a generalized helper (often \\\\${keyof T}\\\), restrict it before passing it into another literal:
\\\ts type KeysOf<T extends object> = \\${Extract<keyof T, string | number | bigint | boolean | null | undefined>}\`;

type PrefixedKeys<T extends object> = \on\${Capitalize<KeysOf<T>>}\; // No nested template literal error
\\\ Using \Extract\ or \Exclude<keyof T, symbol>\` keeps the template literal from hiding symbols, so the compiler can accept the constructed string.

When a helper does multiple concatenations, use a conditional type to infer the inner portion and then reconstruct it:
\\\ts type FlattenLiteral<T extends string> = T extends \\${infer U}\` ? U : T;

type EventName<T extends string> = \handle\${Capitalize<FlattenLiteral<T>>}\;

// Even if T was itself a template literal type, FlattenLiteral narrows it to the inner union before the outer literal rebuilds it.
\\\ This trick lets the outer template literal operate on \U\`, which is a plain union instead of another template literal type.

If you need both the prefixed value and the original literal, build them from the same union rather than reusing a literal alias:
\\\`ts
type States = "idle" | "active";

type Handler = \\${Capitalize<States>}Handler\;
\\\ Avoid writing \type StatesWithSuffix = \\${States}\; type Handler = \\${StatesWithSuffix}Handler\\ because the compiler sees a nested literal instead of a plain \States\` union.