节点拒绝应用样式,因为其MIME类型('text / html')不是受支持的样式表MIME

时间:2018-07-06 01:23:33

标签: html css node.js

我要使用此节点服务器使用index.html为静态main.css服务器:

serve.js:

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

app.use(cors())

app.use(express.static('assets'))

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

app.listen(3000, function () {
  console.log('CORS-enabled web server listening on port 3000')
})

index.html

<!doctype html>
<html class="no-js" lang="">
    <head>
        <link rel="stylesheet" type="text/css" href="./assets/css/main.css">

    </head>
    <body>

        <p>Hello Html!</p>
        <div class="thejson"></div>


        <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
    </body>
</html>

main.css

body {
  background: #ffdd;
  color: #eaeaea;
  padding: 10px;
}

结构:

project structure:
       index.html
       serve.js
       assets
             js
             css
                main.css

当我加载index.html时,虽然css已加载,但在fron节点上服务,我得到:

Refused to apply style from 'http://127.0.0.1:3000/assets/css/main.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

我也尝试了href="/assets/css/main.css"href="./assets/css/main.css",但无济于事。

这可能是什么问题?我该如何解决?

3 个答案:

答案 0 :(得分:3)

替换此行

config.force_ssl = true

使用

false

答案 1 :(得分:1)

我遇到了同样的问题,并且在这个问题上运行了将近几个小时,我注意到我必须使用它:

app.use(express.static(__dirname, "../public"));

它应该可以完成这项工作,并有望节省您的时间。

答案 2 :(得分:0)

我最近遇到了同样的问题。我在文件夹“/public”中有 index.html,在 /views 中有 index.ejs。它误导了 Node.js,所以我从 /public 文件夹中删除了 index.html 以及其他 html 页面。希望它可以节省您的时间