node.js 앱이 CSS가 내 IDE에서로드되지만 localhost에서는로드되지 않는 이유는 무엇입니까?

LightTable을 사용하여 nodejs 응용 프로그램을 만들고 있는데, <link href=""> 태그의 상대 경로를 나타낼 때 CSS가 잘로드되는 것 같습니다. 그러나 node index.js을 실행하면 서버가 시작되고 페이지가 잘로드되지만 콘솔 오류가 발생하고 CSS 404 파일을 지정한 경로에서 찾을 수 없다는 내용의 404 메시지가 표시됩니다. 나는 Heroku의 Foreman Start을 사용해 보았지만 주사위는 사용하지 않았다. 여기에 HTML은 다음과 같습니다node.js 앱이 CSS가 내 IDE에서로드되지만 localhost에서는로드되지 않는 이유는 무엇입니까?

<!DOCTYPE html> 
<html> 
    <head> 
     <title> 
      Home 
     </title> 
     <link href="../../styles/master.css" rel="stylesheet" type="text/css" /> 
    </head> 
...

여기 내 디렉토리 트리 구조입니다 :

. 
├── Procfile 
├── README.md 
├── index.js 
├── package.json 
├── resources 
│   └── images 
│    └── tokyo.jpg 
├── styles 
│   └── master.css 
└── views 
    ├── get 
    │   ├── home.html 
    │   └── posts.html 
    └── post 
     └── new.html

편집 : 질문에 대한 답을 찾은 후, 아래의 내용과 관련이되었다. CSS와 백그라운드 이미지를 원하는대로로드하는 새로운 코드를 주석 처리했습니다.

내 라우팅 및 서버 코드입니다. Express를 사용하지 않고 있습니다.

// routes 
    var homeREGEX = new RegExp('^/?$'); 
    var newREGEX = new RegExp('^/posts/new/?$'); 
    var postsREGEX = new RegExp('^/posts/?$'); 
// var cssREGEX = new RegExp('^/styles/master.css/?$');    <--| static resources also 
// var tokyoREGEX = new RegExp('^/resources/images/tokyo.jpg/?$'); <--| need routes. 

    // server 
    var server = http.createServer(function(request, response){ 
     var pathname = url.parse(request.url).pathname; 

     if (homeREGEX.test(pathname)) { 
     renderHome(request, response); 

     } else if (newREGEX.test(pathname)) { 
     renderPostForm(request, response); 
     } else if (postsREGEX.test(pathname)) { 
     addNewPost(request, response); 
    // } else if (cssREGEX.test(pathname)) {   <--| and they need to get 
    // sendCSS(request, response);     <--| served individually as 
    // } else if (tokyoREGEX.test(pathname)) {   <--| they are requested 
    // sendTokyo(request, response); 
     } else { 
     error404(request, response); 
     } 
    });

출처

2014-09-24 kurofune

의 정확한 경로를 넣어 시도 할 수 있습니다 무엇 당신이 페이지를 찾을 때 당신은 당신의 브라우저에서보고가 작동하지 않습니다 URL? –

localhost : 3000,하지만 localhost : 3000/styles/master.css로 이동하면 404 오류가 발생합니다. – kurofune

페이지를 볼 때 브라우저에 사용하는 URL은 무엇입니까? 내 생각 엔 그게 views/get 부분을 포함하고 있지 않다는 것입니다. 즉, 링크 href 속성에 ..\..이 필요하지 않습니다.

또한 실제로 이러한 정적 파일을 제공하고 있는지 확인하십시오 (그렇지 않은 것 같습니다).

app.use(express.static('resources')); 
app.use(express.static('style'));

이 express.static documentation를 참조하십시오 : 당신은 예를 들어 (nodejs로) 표현을 사용하는 경우, 당신은 이런 식으로 뭔가를해야합니다.

출처

2014-09-24 06:40:19

나는 생각할 수있는 모든 조합에서 "../"s"를 제거하고 추가하려고 시도했습니다. 아직 작동하지 않습니다! – kurofune

괜찮지 만 URL을 알려주십시오. 그렇지 않으면 할 수있는 것이 없습니다. –

위에 게시했습니다 : localhost : 3000. 콘솔에서'x-GET localhost : 3000/styles/master.css'라고 말하면서 거기를 탐색했을 때 404 찾을 수 없음 오류를 확인했습니다. – kurofune

어쩌면 당신은 대신 ../../

<link href="/Procfile/styles/master.css" rel="stylesheet" type="text/css" />

출처

2014-09-24 06:45:09 user3835327

나는 생각할 수있는 경로의 모든 버전을 시도했지만 아무 소용이 없습니다 ... – kurofune

node.js 앱이 CSS가 내 IDE에서로드되지만 localhost에서는로드되지 않는 이유는 무엇입니까?

답변

관련 문제