Estoy aprendiendo a usar componentes de reacción y estilo. Al usar el paquete de componentes con estilo para crear un elemento de botón, la importación de React en la parte superior de mi editor de código da una advertencia de que React está definido/declarado pero nunca usado.
¿No está creando un botón html y asignándolo a una variable javascript JSX? ¿Los componentes con estilo ya tienen la lógica JSX integrada?
import React from 'react'; import styled from 'styled-components'; const Button = styled.button` font: inherit; padding: 0.5rem 1.5rem; border: 1px solid #8b005d; color: white; background: #8b005d; box-shadow: 0 0 4px rgba(0, 0, 0, 0.26); cursor: pointer; &:focus { outline: none; } &:hover, &:active { background: #ac0e77; border-color: #ac0e77; box-shadow: 0 0 8px rgba(0, 0, 0, 0.26); } ` export default Button;La biblioteca de componentes con estilo no es una biblioteca React. Es Javascript simple y sencillo (aunque depende de los literales de la plantilla, que son una nueva característica de JavaScript, por lo que es posible que deba transpilarse a ES5 para una amplia compatibilidad). En su ejemplo, exporta lo que es efectivamente un objeto JavaScript antiguo y simple, no un componente React. JSX es una extensión de sintaxis para escribir eficientemente componentes de React de forma similar a HTML. Aquí no se usa.