Question

拒绝应用“ http://localhost:3001/css/style.css”中的样式因为它的MIME类型（'text / html'）不是受支持的样式表MIME 类型，并启用严格的MIME检查。

我知道这里已经在'style sheet not loading because of MIME type'中进行了讨论，但是我无法使用提供的提示解决问题。

老实说，我对如何做感到很迷茫……是否有人有其他建议以前没有在其他帖子中提到？

客户直接

布局

default.hbs

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link href="https://fonts.googleapis.com/css?family=Nunito+Sans:400,600,700" rel="stylesheet">
    <link rel="stylesheet" href="/css/style.css">
    <!--<link rel="shortcut icon" href="img/favicon.png" type="image/x-icon">-->
    <title>Spoty</title>
    <title>{{title}}</title>
</head>
<body>
    {{{body}}}
</body>
</html>

根目录

index.js

'use strict';


const server = require('./server')();
const config = require('./config');

server.create(config);
server.start();

服务器目录

index.js

'use strict';


const express = require('express');
const bodyParser = require('body-parser');
const expressHandlebars = require('express-handlebars');


module.exports = () => {

    let server = express();
    let create;
    let start;

    // creates server
    create = (config) => {
        let routes = require('./routes');

        // server settings
        server.set('env', config.env);
        server.set('port', config.port);
        server.set('hostname', config.hostname);
        server.set('viewDir', config.viewDir);

        // middleware for parsing json
        server.use(bodyParser.json());


        // Setup view engine
        server.engine('.hbs', expressHandlebars({
            defaultLayout: 'default',
            layoutsDir: config.viewDir + '/layouts',
            extname: '.hbs'
        }));
        server.set('views', server.get('viewDir'));
        server.set('view engine', '.hbs');

        server.use(express.static(__dirname + '/client'));

        // Set up routes
        routes.init(server);

    };

    // start server
    start = () => {
        let hostname = server.get('hostname');
        let port = server.get('port');

        server.listen(port, () => {
            console.log('Express server listening on - http://' + hostname + ':' + port);
        });
    };

    return {
        create, start
    }
};

服务器/路由

index.js

const homeRoute = require('./home');

function init(server) {
    server.get('/', function (req, res) {
        console.log('error here');
        res.redirect('/home');
    });

    server.use('/home',homeRoute);
}

module.exports = {
    init
};

home.js

const express = require('express');
const homeController = require('../controllers/home');

let router = express.Router();

router.get('/',homeController.index);

module.exports = router;

服务器/控制器

home.js

function index(req, res) {
    res.render('home/index', {
        title: 'Home Page'
    });
}

module.exports = {
    index
};

package.json

{
  "name": "example",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "watch:sass": "node-sass /client/sass/main.scss /client/css/style.css -w",
    "devserver": "live-server",
    "start": " node index.js npm-run-all --parallel devserver watch:sass",

    "compile:sass": "node-sass sass/main.scss css/style.comp.css",
    "build:css": "npm-run-all compile:sass"
  },
  "dependencies": {
    "body-parser": "^1.18.3",
    "cookie-parser": "~1.4.3",
    "debug": "~2.6.9",
    "express": "~4.16.0",
    "express-handlebars": "^3.0.0",
    "hbs": "^4.0.1",
    "http-errors": "~1.6.2",
    "jade": "~1.11.0",
    "lodash": "^4.17.10",
    "morgan": "~1.9.0"
  },
  "devDependencies": {
    "nodemon": "^1.18.3",
    "autoprefixer": "^8.6.4",
    "concat": "^1.0.3",
    "node-sass": "^4.9.0",
    "npm-run-all": "^4.1.3",
    "postcss-cli": "^5.0.1"
  }
}

配置

index.js

const _ = require('lodash');
const env = process.env.NODE_ENV || 'local';
const envConfig = require(`./${env}`);


const defaultCofig = env;

module.exports = _.merge(defaultCofig, envConfig);

local.js

let localConfig = {
    hostname: 'localhost',
    port: 3001,
    viewDir: './client/views'
};

module.exports = localConfig;

git repo：https://github.com/rostgoat/NodeExpress

样式表由于MIME无法加载

0 个答案: