Digamos que tienes un archivo CSS con el código:
body{ margin:0px; }Y el archivo HTML index.html. ¿Cómo podría crear un servidor que tome index.html y agregue el CSS? Editar:
var http = require('http'); var fs = require('fs'); function sendFile(res, filename, type) { fs.readFile(filename, function(err, data) { if (err) { console.log(err); res.statusCode = 404; res.end(); return ; } res.writeHead(200, { 'Content-Type': type }); res.write(data); res.end(); }); } http.createServer(function(req, res) { if (req.url == "/") { sendFile(res, "index.html", "text/html"); } else if (req.url == "/styles.css") { sendFile(res, "styles.css", "text/css"); } else { res.statusCode = 404; res.end(); } }).listen(8080);Esto es mucho más simple con un marco simple como Express, donde puede configurarlo para servir automáticamente un directorio de archivos estáticos.
Pero, si desea hacerlo usted mismo usando solo el objeto http incorporado, puede hacer algo como esto:
const http = require('http'); const fs = require('fs'); function sendFile(res, filename, type) { fs.readFile(filename, function(err, data) { if (err) { console.log(err); res.statusCode = 404; res.end(); return; } res.writeHead(200, { 'Content-Type': type }); res.write(data); res.end(); }); } http.createServer(function(req, res) { if (req.url === "/") { sendFile(res, "index.html", "text/html"); } else if (req.url === "/styles.css") { sendFile(res, "styles.css", "text/css"); } else { res.statusCode = 404; res.end(); } }).listen(8080); Luego, dentro de index.html , puedes tener:
<html> <head> <link href="/styles.css" rel="stylesheet"> </head> <body> <div class="red">This is some text that is supposed to be red</div> </body> </html> En styles.css , puede tener:
.red { color: red; } Eso hará que el navegador solicite /styles.css y su servidor web se configurará para servir ese archivo para esa solicitud.