Отправка html и css файла в файл res.sendfile express js

Question

Я не могу отправить файл css и html в файл res.send в файле express.js.

index.html

    <div class="hdngTab">
    <h1 style="align-content: center">Automation Utility</h1>
    </div>

index.css

    .hdngTab{
    background-color: rgb(60, 120, 120);
    box-sizing: border-box;
    border:  solid rgb(60, 120, 120);
    text-align: center
    }

index.js

    const express = require("express");
    const app = express();
    const http = require("http").Server(app).listen(3000);

    console.log("Server Started");

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

Я попробовал приведенные ниже варианты, основанные на некоторых онлайн-ссылках, но ничего не помогло:

1. Передано index.css в корень, поскольку браузер должен загрузить его самостоятельно.

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

2. Создал новую папку и переместил мои статические файлы ( html и css) в эту папку и заменил res.sendfile на app.use (express.static ( "FOLDERNAME"));

Есть ли другой возможный вариант решения?

Answer 1

Вы можете использовать express.static для сервера статических файлов, таких как:

Предположим, ваша структура папок:

app.js
|    +-- public
|    |   +-- css
|    |   |   +-- mystyle.css

const express = require("express");
const app = express();

// using express you don't need this
// const http = require("http").Server(app).listen(3000);

// server your css as static
app.use(express.static(__dirname + 'public'))

console.log("Server Started");

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

// start your server
app.listen(3000, () => console.log('Server started at port 3000'))

В вашем HTML

<link href="css/mystyle.css"