(해결) Uncaught TypeError - Super expression must either be null or a function

아래는 에러를 재현한 codesandbox이다.

에러

1Uncaught TypeError: Super expression must either be null or a function

원인

위 코드샌드박스의 코드는 아래와 같은 구조로 되어 있다.

1. SubClass와 FirstClass를 다른 파일에서 선언
2. SubClass가 FirstClass를 상속하면서, FirstClass를 import
3. FirstClass가 선언된 파일에 SubClass를 import

이때 SubClass 파일과 FirstClass 파일이 서로를 import 하며 순환 의존성이 생기며 서로를 계속 호출하게 된다.

해결

1. SubClass를 FirstClass가 있는 파일에 선언한다.
2. FirstClass 파일에선 SubClass를 사용하지 않는다.

순환 의존에 대한 더 자세한 이야기는 --> 참고

이 포스트의 상황에 해당되지 않고 React.js의 Class Component를 사용하고 있다면

1class MyComponent extends React.component

처럼 component의 c를 소문자로 적었을 때 같은 에러가 발생하기도 하는 것 같다. React.Component와 같이 첫 글자를 대문자로 수정해야 한다.