问题

我刚刚尝试通过vite上的样式化组件构建一个组件。但是，当我尝试使用样式化组件中的文本时，它在控制台上抛出了一个错误：

Warning: The tag <text> is unrecognized in this browser. If you meant to render a React component, start its name with an uppercase letter.
    at text
    at O2 (http://localhost:5173/node_modules/.vite/deps/styled-components.js?v=b320d886:1423:6)
    at TextView (http://localhost:5173/src/components/TextView/index.jsx?t=1678354528314:18:3)
    at Header
    at App
printWarning                @   react-dom.development.js:86
error                       @   react-dom.development.js:60
createElement               @   react-dom.development.js:9816
createInstance              @   react-dom.development.js:10941
completeWork                @   react-dom.development.js:22187
completeUnitOfWork          @   react-dom.development.js:26596
performUnitOfWork           @   react-dom.development.js:26568
workLoopSync                @   react-dom.development.js:26466
renderRootSync              @   react-dom.development.js:26434
performConcurrentWorkOnRoot @   react-dom.development.js:25738
workLoop                    @   scheduler.development.js:266
flushWork                   @   scheduler.development.js:239
performWorkUntilDeadline    @   scheduler.development.js:533

编号

import styled from 'styled-components';
// import variablesBreakpoints from '../../helpers/variablesBreakpoints';

function TextView({ children, color, fontSize, fontWeight }) {
  const StyledText = styled.text`
    color: ${color};
    font-size: ${fontSize};
    font-weight: ${fontWeight};
  `;

  return <StyledText>{children}</StyledText>;
}

TextView.defaultProps = {
  color: '#fff',
  fontSize: '1em',
  fontWeight: 'normal',
};

export default TextView;

注解

1.我没有转换为大写，因为它会自动转换。
1.我做了一个研究，我看到了插件。