Estoy empezando a usar Node.js y esto es lo que tengo hasta ahora...
server.js
var http = require('http'); const PORT = 3000; var fs = require('fs'), path = require('path'), filePath = path.join(__dirname, 'index.html'); fs.readFile(filePath, {encoding: 'utf-8'}, function(err, html) { if (err) throw err; http.createServer(function(request, response) { response.writeHeader(200, {"Content-Type": "text/html"}); response.write(html); response.end(); }).listen(PORT); console.log("Server successfully hosted at http://127.0.0.1:" + PORT + "/"); }); index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" type="text/css" href="styles.css"> <title>My First Node.js!</title> </head> <body> <h1>Hello there!</h1> <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Rem perferendis ratione itaque, alias nesciunt nemo porro deserunt animi iusto dolor?</p> </body> </html> styles.css
*, *::before, *::after { box-sizing: border-box; } h1 { text-align: center; } p { text-align: center; }Sin embargo, cuando ejecuto el servidor, no aparece ninguno de mis estilos CSS. Cuando utilicé las herramientas de Google Dev para verificar, ¿mi archivo CSS tenía el código HTML?
Captura de pantalla de fuentes de herramientas de desarrollo
Supongo que el HTML <link rel="stylesheet" type="text/css" href="styles.css"> de alguna manera está creando un archivo CSS en lugar de encontrar el archivo.
Por favor, hágame saber si hay alguna forma de solucionar esto.
Gracias.