`babel-plugin-реагировать-css-modules` Проверка типов текста

Question

Я использую babel-plugin-react-css-modules. Он добавляет свойство styleName к элементам HTML. Typescript не распознает это свойство. Я почти уверен, что мне нужно что-то расширить, но все, что я пробовал, сработало.

Я попытался объявить Element в файле '.d.ts', чтобы выполнить объединение объявлений, но я, должно быть, сделал что-то не так.

interface Element {
    styleName: string;
}

export const Wrapper: React.FC<IWrapperProps> = ({ children, style }) => (
  <div styleName="wrapper" style={style}>
    {children}
  </div>
);

ОБНОВЛЕНИЕ:

.d.ts не работает

Answer 1

Добавьте @types/react-css-modules к вашему package.json и styleName будет распознано:

npm install @types/react-css-modules --save-dev

Answer 2

Поскольку вы находитесь в модуле (он имеет экспорт), вы работаете с отдельной областью действия от глобальной области действия, поэтому вы просто создаете интерфейс с именем Element, который отделен от глобальной декларации.

Я бы поместил интерфейс в отдельный файл без экспорта / импорта (augmentations.d.ts) и добавил бы его к вашему tsconfig.json.