小编khi*_*erl的帖子

这是 cra 的全新安装，在节点 13.11.0 上运行打字稿模板，尝试运行 npm start 时出现错误

TypeScript error in D:/Projects/personal-site/node_modules/@types/testing-library__react/node_modules/pretty-format/build/index.d.ts(7,13):
'=' expected.  TS1005

     5 |  * LICENSE file in the root directory of this source tree.
     6 |  */
  >  7 | import type * as PrettyFormat from './types';
       |             ^
     8 | /**
     9 |  * Returns a presentation string of your `val` object
    10 |  * @param val any potential JavaScript object```

我遵循了文档中的所有内容， 并在 YouTube 上观看了Ben Awad的教程。尽管如此，我还是无法让它发挥作用。

const TextField = (props: FieldHookConfig<{}>) => {
    const [field] = useField(props);
        return (
            <div>
                <input {...field} {...props}/>
            </div>
        );
    };

我使用 theFieldHookConfig作为 props 的类型，因为useField它期望Field.d.ts 文件中的astring或FieldHookConfigbase。然而打字稿仍然不高兴。

它在这一行抱怨 <input {...field} {...props}/>

(property) JSX.IntrinsicElements.input: React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>
Type '{ ref?: string | ((instance: HTMLInputElement | null) => void) | RefObject<HTMLInputElement> | null | undefined; key?: string | number | undefined; ... 289 more ...; innerRef?: …

container正在抱怨，因为HTMLDivElement | null无法分配给元素类型

export const Loader: React.FC = () => {
  const element = useRef<HTMLDivElement>(null);  
  useLayoutEffect(() => {
    lottie.loadAnimation({
      animationData,
      container: element.current,
      loop: true
    });
  });

  return (
    <Wrapper>
      <div ref={element}></div>
    </Wrapper>
  );
};