What's the TypeScript Type for the style Attribute in React?

Learn about the correct TypeScript type for the style attribute in React

The correct TypeScript type for the style attribute in React is:

React.CSSProperties

To give you an example, let's consider the following React component:

import React, { FunctionComponent, CSSProperties } from 'react';

type Props = { styleRules: CSSProperties; };

const Button: FunctionComponent<Props> = ({ styleRules, children }) => (
    <button style={{ ...styleRules }}>{children}<button>
);

export default Button;

If the React.CSSProperties type is not available, make sure you have @types/react package installed, for example, like so:

npm install --save @types/react

Hope you found this post useful. It was published . Please show your love and support by sharing this post.