프로그래머스 데브코스 TIL - Day 20

 

✅ 오늘의 학습

오늘도 역시 과제 구현을 중점적으로 진행했다.

 

 

과제를 구현하며 가장 많이 본 에러...

Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.

 

보통 javascript module에서 import export시

확장자 명이나 경로를 잘못 입력했을 때 발생하는 오류이다..

 

 

하지만 VanillaJS에서 route에서 url을 변경하고 새로고침 시에도 해당 오류가 발생했다.

 

이유는 SPA를 구현하기위해 404페이지 접근 시 index로 돌아가도록 npx serve -s로 구동했는데
index.html에 상대경로인 ./ 을 지정했기 때문이다. + css도 마찬가지!

 

✅ 해결 방법

<script src="./src/main.js" type="module"></script> // (X)
<script src="/src/main.js" type="module"></script> // (O)

 

물론 강의에서 말했던 내용이지만

미처 생각을 못하고 있었어서 아차 했던 부분이다.

 

---

✍ 느낀 점

 

과제를 꽤 빨리 시작했지만 진척이 좀 적은 하루이다..

과제에 추가할 기능을 구현하기 위한 문서를 읽고 테스트 해보는 시간과

스터디를 진행하기 위해 글을 정리하는 시간으로 코어타임의 대부분을 보냈다.

contentEditable에 대해 문서를 확인하고 이것 저것 보았지만

내가 원하는 것과 비슷하게 구현한 사례를 찾지 못했다.😢

원래 같았으면 붙잡고 계속 했을텐데 보너스 구현사항이 조금 더 남아 있기도 하고

css를 구현을 해놓지 못해서 해당 부분은 잠시 멈춰두고 다음 요구사항을 진행했다.

과제를 시작했을 초반엔 요구사항이 아닌 부분에 힘을 쓰다가 기본 요구사항 조차도 완성을 시키지 못했었다.

중간에 생각을 바꾸고 기본 요구사항 먼저 처리를 하고 보너스 요구사항 후 이후에 원하는 기능들을 추가하기로 했다!

어설프게 여러 기능을 넣고 미완성으로 제출하느니 요구사항들을 충족하고 기능은 부족하더라도

완성도 있는 과제가 될 것이라고 판단이 되었다.

빨리 마무리 짓고 남는 시간에 하고 싶었던 기능들을 꼭 구현해야겠다! 🔥