nodejs/экспресс включают местные JS файл

Question

Вот моя текущая структура папок

css 
    app.css 
js 
    app.js 
node-modules 
index.html 
node-server.js 
package.json 

Узел-сервер хостинг index.html, но я не могу понять, как получить app.js и app.css файлы загружаются.

index.html загружает их с:

<script src="js/app.js"></script> 
<link rel="stylesheet" type="text/css" href="css/app.css"/> 

Вот сообщение об ошибке:

Failed to load resource: the server responded with a status of 404 (Not Found) 
2http://localhost:3000/css/app.css Failed to load resource: the server 
responded with a status of 404 (Not Found) 

Я знаю, что нужно требовать или модуль загрузки или что-то, просто не могу понять, что.

Благодаря

Answer 1

Tomasz Kasperek Как отмечалось, вы должны позволить Экспресс знать, что вы намерены разместить эти файлы в статическом каталоге. Это технически называется defining static middleware.

Это должно выглядеть примерно так:

var express = require('express'); 
var app = express(); 

// first parameter is the mount point, second is the location in the file system 
app.use("/public", express.static(__dirname + "/public")); 

Это супер просто, и я предлагаю вам идти по пути создания своего рода public папки, а не удосужившись сделать определенные файлы и папки статические.

Затем файлы будут просто ссылаться как и от корня index.html:

<link href="public/css/reset.css" rel="stylesheet" type="text/css"> 

Надеется, что это помогает!

Answer 2

Причина Node.js не сервер статического контента на своем собственном, маршруты есть в определенные для обслуживания статического контента с помощью узла.

Solution (Руководство):

var express = require('express'), 
    path = require('path'), 
    app = express(); 

app.get('/index.html',function(req,res){ 
    res.sendFile(path.join(__dirname + '/index.html')); 
}); 

app.get('/css/app.css',function(req,res){ 
    res.sendFile(path.join(__dirname + '/css/app.css')); 
}); 

app.get('/js/app.js',function(req,res){ 
    res.sendFile(path.join(__dirname + '/js/app.js')); 
}); 

app.get('/', function(req, res) { 
    res.redirect('index.html'); 
}); 

app.listen(8080); 

Лучшее решение:

Структура каталогов:

public 
css 
    app.css 
js 
    app.js 
index.html 

КОД:

var express = require('express'), 
    path = require('path'), 
    app = express(); 

// Express Middleware for serving static files 
app.use(express.static(path.join(__dirname, 'public'))); 

app.get('/', function(req, res) { 
    res.redirect('index.html'); 
}); 

app.listen(8080);