상황
<!--link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"-->
<link href="../bootstrap.css" rel="stylesheet" id="bootstrap-css">cdn을 사용하지 않고 bootstrap.css 파일을 로컬에 포함해서
내가 구현하고자 하는 웹페이지의 디테일을 조작하기 위해
bootstrap.css를 작업 중인 디렉토리에 포함하고 경로를 지정했는데도
계속 css 파일을 찾지 못하고
와 같이 css가 적용되지 않은 html의 틀만 뱉어냈다.
까닭
결국 경로를 제대로 설정하지 않아서인데,
경로를 제대로 로컬에 포함하고 맞는 상대 경로를 지정해줬어도
// user에게 public folder를 사용가능하게 제공 /public 이동시 public폴더를 볼 수있음
//express.static : express의 정적 파일 제공
app.use("/public", express.static(__dirname + "/public"));server.js에서 해당 코드를 포함했기 때문에
user를 위한 정적 파일은 public 디렉토리 안에 포함되어야 한다.
그런데 public에 .css파일이 없으므로 찾을 수 없는 것이다.
해결
bootstrap.css를 public 디렉토리에 포함하고, 상대경로를 그에 맞게 수정하였다.
<link href="../public/bootstrap.css" rel="stylesheet" id="bootstrap-css">
참고한 글
https://pythonq.com/so/css/757552
css - 로컬 파일 (서버 없음)의 Internet Explorer“CSS가 MIME 형식이 일치하지 않아 무시되었습니다” -
css - 로컬 파일 (서버 없음)의 Internet Explorer“CSS가 MIME 형식이 일치하지 않아 무시되었습니다” 기사 출처 css internet-explorer web
pythonq.com
https://tristan91.tistory.com/608
자원이 MIME 타입(“text/html”)이 일치하지 않아서 (X-Content-Type-Options: nosniff) 차단되었습니다.
js 파일을 인크루드했는데, 파일경로를 찾을 수 없을 때 생기는 에러였다. // apache root 경로 밖의 파일을 root로 옮기고 // 아래와 같이 변경
tristan91.tistory.com