jQuery 에러 - Uncaught TypeError : Cannot read property 'fn' of undefined 해결하기

Uncaught TypeError : Cannot read property 'fn' of undefined 해결 방법~!

 

달력에 일정을 표시해야 하는 페이지를 만들어야 할 일이 생겼습니다.

 

FullCalendar라는 좋은 무료 캘린더가 있기에 

(기업이나 상업용으로 사용시 무료가 아닙니다....ㅠㅠ)

 

다운받은 후 관련 js / css 파일을 링크 시킨 후 실행는데 아무리 해도 달력이 나오질 않았습니다.

 

분명 다운 받은 demo 파일은 잘 되는데...

 

크롬에서 f12를 눌러 개발자도구로 확인해 보니

 

Uncaught TypeError : Cannot read property 'fn' of undefined 에러가 뜨더군요.

 

알아보니 fullcalendar.js를 먼저 불러 와서 그렇다고 합니다.

 

FullCalendar를 실행 하려면 fullcalendar.js를 불러 오기전에 

 

jquery-ui.js 와 moment.min.js 를 먼저 불러 와야 한다는건데요.

 

js파일을 import 시킬때 순서가 중요하단 이야기 입니다.

 

저의 경우에는 fullcalendar.js 를 먼저 링크 시키고 그 아래에 moment.min.js 를 링크 시켜서 에러가 났던겁니다.

 

아래 순서대로 하니 해결 됩니다.

 

<link href="js/calendar/fullcalendar.css" />

<script src="js/common/jquery-ui.js"></script>

<script src="js/calendar/moment.min.js"></script>

<script src="js/calendar/fullcalendar.js"></script>

 

 

FullCalendar 다운로드  : https://fullcalendar.io/