Загрузка stati c файлов в Express - PullRequest
0 голосов
/ 10 июля 2020

Я пытался получить свой файл node.JS для обслуживания моего приложения HTML с включенными файлами stati c CSS и JS, но столкнулся с большими трудностями (файл HTML загружается , но без стилизации). Из моих поисков кажется, что основным рекомендуемым методом является добавление промежуточного программного обеспечения Express к вашему node.JS, а затем добавление этой строки:

app.use(express.static(path.join(__dirname, 'static/')));

Прежде, чем я go, я покажу вам настройка моего каталога:

-static
    -images
        -favicon
            -favicon.png
        -logo.png
    -style
        -design.css
        -theme.css
        -w3.css
    -source
        -client
            -style.js
-node_modules
    -...
-index.html
-root.js
-package-lock.json
-...

Файл 'root. js' - это мой файл node.JS, который я запускаю, и он обслуживает страницу 'index. html', но все файлы CSS и JS ссылаются на мои HTML страницы, чтобы вывести такую ​​ошибку ...

The stylesheet http://localhost:8080/static/style/design.css was not loaded because its MIME type, "text/html", is not "text/css".

Вот один пример строки в моем индексе. html 'где я пытаюсь установить ссылку на этот CSS файл ...

<link rel="stylesheet" type="text/css" href="static/style/design.css">

... и вот где' index. html 'обслуживается в моем' root. js 'file ...

http.createServer(function (req, res) {
    fs.readFile('index.html', function (err, data) {
        res.writeHead(200, { 'Content-Type': 'text/html' });
        res.write(data);
        return res.end();
    });
}).listen(8080); 

Я не совсем уверен, где я ошибаюсь, поскольку большинство руководств по топи c, кажется, подразумевают, что когда я добавляю в magi c' __dirname ' строчку к моему node.JS, что все должно разрешиться само. Когда я просто запускаю свою страницу HTML локально, открывая ее в Chrome или Firefox, она работает нормально. Я надеюсь, что вы сможете объяснить мне, в чем я ошибаюсь, спасибо.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...