Javascript ExpressJS在HTML5模式下的更深层url链接期间呈现错误的静态路径_Javascript_Css_Angularjs_Node.js_Express

Javascript ExpressJS在HTML5模式下的更深层url链接期间呈现错误的静态路径

javascript css angularjs node.js express

Javascript ExpressJS在HTML5模式下的更深层url链接期间呈现错误的静态路径,javascript,css,angularjs,node.js,express,Javascript,Css,Angularjs,Node.js,Express,我正在尝试在我的web应用程序中实现HTML5模式。我正在使用Angular的ui路由器到达那里。客户端工作得很好。每当我打开主网页（127.1.1.1:8080）时，它都能完美加载。点击一个链接到（127.1.1.1:8080/admin/dashboard）的按钮，它也可以完美加载刷新127.1.1.1:8080仍然可以当我刷新127.1.1.1:8080/admin/dashboard页面时，出现了这个问题。它给出： Resource interpreted as Styleshee

我正在尝试在我的web应用程序中实现HTML5模式。我正在使用Angular的ui路由器到达那里。客户端工作得很好。每当我打开主网页（127.1.1.1:8080）时，它都能完美加载。点击一个链接到（127.1.1.1:8080/admin/dashboard）的按钮，它也可以完美加载

刷新127.1.1.1:8080仍然可以

当我刷新127.1.1.1:8080/admin/dashboard页面时，出现了这个问题。它给出：

Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://127.1.1.1:8080/admin/libs/components-font-awesome/css/font-awesome.min.css".
Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://127.1.1.1:8080/admin/assets/css/style.css".

它似乎错误地获得了css样式。这条路是错误的，应该是错误的。我相信我必须重写server.js中的静态路径，我已经这样做了。我还缺少什么

server.js

var express = require('express'),
    app = express(),
    mongoose = require('mongoose'),
    bodyParser = require('body-parser'),
    api = require('./app/routes'),
    port = process.env.PORT || 8080; 

app.use('/app', express.static(__dirname + '/public/app'));
app.use('/assets', express.static(__dirname + '/public/assets'));
app.use('/libs', express.static(__dirname + '/public/libs'));

app.post('/api/user', api.post);
app.all('*', function(req, res, next) {
    res.sendFile('/public/index.html', { root: __dirname });
});

app.use(bodyParser.json()); 

app.listen('8080');
console.log('The magic happens on port 8080');

app.config.js

angular
    .module('app')
    .config(config);

config.$inject = ['$urlRouterProvider','$stateProvider','$locationProvider'];

function config($urlRouterProvider,$stateProvider,$locationProvider) {
    $urlRouterProvider.otherwise('/');

    $stateProvider
    .state('home', {
        url:'/',
        templateUrl: 'app/home/home.html',
        controller: 'HomeController',
        controllerAs: 'vm'
    })
    .state('admin', {
        url:'/admin',
        templateUrl: 'app/admin/admin.html',
        controller: 'AdminController',
        resolve: {app: check_logged}
    })
    .state('admin.dashboard', {
        url: '/dashboard',
        template: 'I could sure use a drink right dashboad.'
    })
    .state('admin.product', {
        url: '/product',
        template: 'I could sure use a drink right product.'
    })

    $locationProvider.html5Mode({
        enabled: true
    });
}

index.html

    <head>
    <meta  http-equiv="content-type" content="text/html;" charset="UTF-8">
    <meta name="viewport" content="width=device-width">
    <link rel="stylesheet" href="/libs/materialize/dist/css/materialize.min.css"></link>
    <link rel="stylesheet" href="/libs/components-font-awesome/css/font-awesome.min.css"></link>
    <link rel="stylesheet" href="/assets/css/style.css">
    <base href="/">
</head>

尝试将CSS中的

类型

属性添加到

文本/CSS

，如下所示-

 <link rel="stylesheet" type="text/css"  ref="/libs/materialize/dist/css/materialize.min.css">

该问题与mime类型有关。

尝试将CSS中的

type

属性添加到

text/CSS

，如下所示-

 <link rel="stylesheet" type="text/css"  ref="/libs/materialize/dist/css/materialize.min.css">

该问题与mime类型有关。

请在index.html中检查css文件-

以及其他文件的mime类型`此问题与服务器提供的mime类型错误有关。。我想这行得通@钱丹，谢谢你！请写下它作为我能够接受它的答案。你的猜测完全正确。请检查一下在index.html中对css文件-

和其他文件执行此操作`此问题与服务器提供的mime类型错误有关。。我想这行得通@钱丹，谢谢你！请写下来作为我能接受的答案你的猜测完全正确。