22.09.01 기록
Uncaught SyntaxError: Unexpected token '<' 결론: 파일 경로가 올바르지 않아 스크립트 태그에 지정된 파일을 찾을 수 없어 에러 발생!!
✅ 해결 과정
메인 페이지의 기본 뼈대(html)를 작성하고, css와 js 파일을 연결해준 뒤 실행을 해보았는데 위의 에러가 발생하였다.
SyntaxError 하면 보통 문법 오류이기에 메인 페이지 html 파일에 잘못 작성된 문법은 없는지, 태그가 잘 열고 닫혔는지 등을 확인해보았다.
근데.. 아무리 찾아봐도 html 문법에는 오류가 없었다.
구글링 해본 결과, 사람마다 오류의 원인이 조금씩 다르긴 했지만 stack overflow 사이트에서 내 오류의 원인을 찾을 수 있었다. 스택 오버플로 - Unexpected token '<'
우선 답변을 보면 "사실 <!DOCTYPE html> 서버의 예상치 못한 반응이다." 라고 한다. (영어를 잘 못해서..)
대략 "사실은 뭔가 예기치 못한 다른 문제가 있다!" "html 문법 문제가 아니다" 라는 것 같은데..
그 밑에 드래그 해놓은 댓글을 보면, 본인은 "파일 경로가 올바르지 않고 스크립트 태그에 지정된 파일을 찾을 수 없기 때문에 이 오류가 발생했다"고 했다.
즉, 태그 문법 자체의 오류라기보단 경로 설정이나 그 밖의 다른 문제들로 일어난 경우라고 생각해 볼 수 있겠다. 그리고 실제로 나 역시 js 경로가 잘못 되어 있었다..
//수정 전
<script defer src="/javascripts/main.js"></script>
//수정 후
<script defer src="/public/javascripts/main.js"></script>사실 메인 페이지 최상단의 설정 코드들은 내가 바로 직전 진행했던 webtoon-moa 프로젝트를 참고했는데, 그때는 public 폴더를 static folder 로 지정하여 따로 public을 작성해주지 않아도 문제가 없던 것이였다. 이번에는 그렇지 않은 경우라 public 을 써줬어야 했다!!
'Project > I'm Hear' 카테고리의 다른 글
| [트러블슈팅, JS] - ⭐스크롤을 항상 아래로⭐ (0) | 2022.09.12 |
|---|---|
| [트러블슈팅, CSS] - 내용이 요소의 크기를 벗어나면 스크롤 기능 (0) | 2022.09.11 |
| [트러블슈팅, JS] - div 클릭 시 div의 text 내용 복사 (2) | 2022.09.10 |
| [트러블슈팅, JS] - 버튼 클릭 시 페이지 이동 (0) | 2022.09.10 |
| [트러블슈팅, JS] - getUserMedia() 관련 에러 (2) | 2022.09.10 |