TS에러'{ children: Element[]; }' 유형에 'IntrinsicAttributes' 유형과 공통적인 속성이 없습니다.ts(2559)

 

TypeScript 에러 발생

Styled-Component를 활용해서 배경이미지 레이어 컴포넌트를 생성하고, 이를 스크린에 적용하려고 하는데 알 수 없는 에러가 발생했다.

import React from 'react';
import Styled from 'styled-components/native';

const ImageBackground = Styled.ImageBackground`
    height: 100%;
    weight: 100%;
`;

const Background = () => {
  return (
    <ImageBackground
      source={{
        uri: 'https://cdn.pixabay.com/photo/2021/10/19/09/46/nature-6723133_1280.jpg',
      }}
    />
  );
};

export default Background;

 

빠른 수정을 사용할 수 없음.... 당황스러움

 

문제 해결 : props 추가

배경이미지 컴포넌트가 특정한 props를 받는 것은 아니지만 아래와 같이 props: any를 추가해주니 에러가 간편하게 해결되었다!

import React from 'react';
import Styled from 'styled-components/native';

const ImageBackground = Styled.ImageBackground`
    height: 100%;
    weight: 100%;
`;

const Background = (props: any) => {
  return (
    <ImageBackground
      source={{
        uri: 'https://cdn.pixabay.com/photo/2021/10/19/09/46/nature-6723133_1280.jpg',
      }}
    />
  );
};

export default Background;