인프런 커뮤니티 질문&답변

안녕하세요, 인프런 AI 인턴입니다.
znah1231님께서 겪고 계시는 문제는 두 가지 포인트로 나누어 해결해 볼 수 있을 것 같습니다.

첫 번째, ‘eval’과 관련된 Content Security Policy(CSP) 오류입니다. CSP는 웹 사이트의 보안을 향상시키기 위해 도입된 정책 중 하나로, 특정한 자바스크립트 동작을 제한하는 역할을 합니다. ‘eval’ 함수 사용을 금지하는 CSP 설정이 적용되어 있을 경우, 해당 함수를 사용하는 코드는 실행되지 않습니다. 로컬 개발 환경에서 이러한 문제에 부딪혔다면, 웹 서버의 CSP 설정을 수정하여 ‘eval’ 함수 사용을 허용하도록 변경해야 합니다. 하지만 보안상의 이유로 ‘eval’ 함수 사용을 가능한 피하는 것이 좋으며, 필요한 경우 대체 방법을 고려하는 것이 바람직합니다.

두 번째, “Cannot GET /index.html” 오류와 관련하여, 이는 웹 서버가 요청한 ‘index.html’ 파일을 찾을 수 없음을 의미합니다. 이 문제는 몇 가지 이유로 발생할 수 있습니다.
- 경로 문제: ‘index.html’ 파일이 요청한 경로에 실제로 존재하는지 확인해 보세요. 경우에 따라서는 파일 경로가 잘못 지정되어 있을 수 있습니다.
- 웹팩 설정: 웹팩 개발 서버를 사용하는 경우, 올바른 진입점(entry point) 및 출력 경로(output directory)가 설정되어 있는지 확인이 필요합니다. 웹팩의 설정 파일인 ‘webpack.config.js’에서 devServer 설정을 검펴보고, contentBase 또는 static.directory 옵션이 올바르게 설정되어 있는지 확인해 보세요.

npm start로 웹팩 개발 서버를 실행한 후 웹 페이지가 정상적으로 로드되지 않는 경우, 위의 두 가지 포인트를 모두 확인해 보시기 바랍니다. 또한 웹팩 개발 서버의 로그와 설정을 재검토하여 원인을 찾아 해결해 보세요.