Estoy usando la biblioteca de componentes con estilo y estoy tratando de diseñar un componente, pero no sé el tipo. He intentado un montón, pero sigo recibiendo un error Error: Cannot create styled-component for component . ¡Gracias de antemano por cualquier ayuda!
export const StyledSupply = styled.text ` textAlign: "center", fontSize: 30, fontWeight: "bold", color: "var(--accent-text)" `; <s.TextTitle style={StyledSupply}> {data.totalSupply} / {CONFIG.MAX_SUPPLY} </s.TextTitle>Le sugiero que mire ejemplos de la documentación: https://styled-components.com/docs/basics#getting-started
Si solo desea diseñar un texto, puede intentar cambiar su código a algo como esto:
// Styled Component export const StyledSupply = styled.span` textAlign: center; fontSize: 30; fontWeight: bold; color: var(--accent-text); `; // Render <StyledSupply> {data.totalSupply} / {CONFIG.MAX_SUPPLY} </StyledSupply> Es posible que deba definir --accent-text como una variable y usarla en su lugar.
Además, es posible que sus propiedades CSS deban usar los nombres oficiales, por ejemplo, es posible que textAlign deba ser text-align , etc.
Puede dar un paso más si s.TextTitle es un componente válido y acepta className como accesorio, puede hacer esto:
// Styled Component export const StyledTextTitle = styled(s.TextTitle)` text-align: center; font-size: 30; font-weight: bold; color: var(--accent-text); `; // Render <StyledTextTitle> {data.totalSupply} / {CONFIG.MAX_SUPPLY} </StyledTextTitle>Documentos:https://styled-components.com/docs/basics#styling-any-component