eslint-plugin-jsx-dollar

Eslint plugin that check JSXText's unnecessary template literal $ character.

Install

yarn add -D eslint-plugin-jsx-dollar

.eslintrc.js

module.exports = {
  "plugins": [
    ...,
    "jsx-dollar"
  ],
  "rules": [
    ...,
    "jsx-dollar/jsxDollar": "error",
  ]
  ...,
}

Example

When using JavaScript template literals, use `${expression}`. But, we rarely typo ${} in JSX text.

Details are shown below.

const text = "sample";

export const Success: React.FC = () => {
  return (
    <span>{`${text}`}</span>
    // Equals <span>sample</span>
  );
};

export const Failed: React.FC = () => {
  return (
    <span>${text}</span>
    // Equals <span>$sample</span>
  );
};

Lisence

MIT