@typescript-eslint/no-unnecessary-template-expression

A template literal that holds nothing but one string, like `${name}`, is that string. A literal inside ${}, like `${"px"}`, can be written as plain text. In both cases the ${} makes the reader look for a conversion that doesn't happen.

The rule reports a template that's only one ${} with a string in it, and any ${} that holds a string, number, bigint, boolean, regular expression or template literal, null, undefined, NaN or Infinity. Template literal types are checked too. Tagged templates aren't.

--fix removes the ${}.

Configure

Off by default. This rule needs types, so turning it on makes bun lint type check your code first.

[lint.rules]
"@typescript-eslint/no-unnecessary-template-expression" = "error" # or "warn"

Examples

Reported:

function describe(name: string, width: number) {
  const title = `${name}`;
  const size = `${width}${"px"}`;
  const retries = `retries: ${3}`;
  return [title, size, retries];
}

type Size = `${number}${"px"}`;

Not reported:

function describe(name: string, width: number) {
  const title = name;
  const size = `${width}px`;
  const retries = "retries: 3";
  return [title, size, retries];
}

type Size = `${number}px`;

A template that turns another type into a string does real work:

function toText(count: number) {
  return `${count}`;
}

Spaces at the end of a line are easy to miss and editors often strip them, so ${" "} before a line break is allowed:

const usage = `Usage:${" "}
  save <file>`;