如何从节点/快速应用正确提供index.html？

Question

我试图从我的节点/ Express应用程序提供index.html文件，但运气不佳。

这是我的server.js：

const express = require('express');
const path = require('path');
const http = require('http');
const bodyParser = require('body-parser');



const app = express();

//Parsers for POST data
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));

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


// Catch all other routes and return the index file
app.get('/', (req, res) => {
    res.sendFile(path.join(__dirname, '/index.html'));
});

/**
 * Get port from environment and store in Express.
 */
const port = process.env.PORT || '3000';
app.set('port', port);

/**
 * Create HTTP server.
 */
const server = http.createServer(app);

/**
 * Listen on provided port, on all network interfaces.
 */
server.listen(port, () => console.log(`API running on localhost:${port}`));

我的index.html文件与server.js位于同一根目录中：

/Users/e602684/Documents/dev/monster/Angular_Full_Version/server.js
/Users/e602684/Documents/dev/monster/Angular_Full_Version/index.html

当我启动服务器时，导航到localhost：3000 /

我遇到很多错误：

Refused to apply style from 'http://localhost:3000/css/animate.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
localhost/:1 Refused to apply style from 'http://localhost:3000/css/style.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
localhost/:41 GET http://localhost:3000/js/jquery/jquery-3.1.1.min.js net::ERR_ABORTED 404 (Not Found)
localhost/:1 Refused to apply style from 'http://localhost:3000/css/bootstrap.min.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
localhost/:1 Refused to apply style from 'http://localhost:3000/font-awesome/css/font-awesome.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
localhost/:42 GET http://localhost:3000/js/plugins/jquery-ui/jquery-ui.min.js net::ERR_ABORTED 404 (Not Found)
localhost/:43 GET http://localhost:3000/js/bootstrap/bootstrap.min.js net::ERR_ABORTED 404 (Not Found)
localhost/:46 GET http://localhost:3000/js/plugins/metisMenu/jquery.metisMenu.js net::ERR_ABORTED 404 (Not Found)
localhost/:49 GET http://localhost:3000/js/plugins/slimscroll/jquery.slimscroll.min.js net::ERR_ABORTED 404 (Not Found)
localhost/:58 GET http://localhost:3000/js/angular/angular.min.js net::ERR_ABORTED 404 (Not Found)
localhost/:52 GET http://localhost:3000/js/plugins/pace/pace.min.js net::ERR_ABORTED 404 (Not Found)
localhost/:55 GET http://localhost:3000/js/inspinia.js net::ERR_ABORTED 404 (Not Found)
localhost/:59 GET http://localhost:3000/js/angular/angular-sanitize.js net::ERR_ABORTED 404 (Not Found)
localhost/:61 GET http://localhost:3000/js/angular-translate/angular-translate.min.js net::ERR_ABORTED 404 (Not Found)
localhost/:62 GET http://localhost:3000/js/ui-router/angular-ui-router.min.js net::ERR_ABORTED 404 (Not Found)
localhost/:60 GET http://localhost:3000/js/plugins/oclazyload/dist/ocLazyLoad.min.js net::ERR_ABORTED 404 (Not Found)
localhost/:63 GET http://localhost:3000/js/bootstrap/ui-bootstrap-tpls-1.1.2.min.js net::ERR_ABORTED 404 (Not Found)
localhost/:64 GET http://localhost:3000/js/plugins/angular-idle/angular-idle.js net::ERR_ABORTED 404 (Not Found)
localhost/:75 GET http://localhost:3000/js/app.js net::ERR_ABORTED 404 (Not Found)
localhost/:76 GET http://localhost:3000/js/config.js net::ERR_ABORTED 404 (Not Found)
localhost/:77 GET http://localhost:3000/js/translations.js net::ERR_ABORTED 404 (Not Found)
localhost/:78 GET http://localhost:3000/js/directives.js net::ERR_ABORTED 404 (Not Found)
localhost/:79 GET http://localhost:3000/js/controllers.js net::ERR_ABORTED 404 (Not Found)
localhost/:58 GET http://localhost:3000/js/angular/angular.min.js net::ERR_ABORTED 404 (Not Found)
localhost/:59 GET http://localhost:3000/js/angular/angular-sanitize.js net::ERR_ABORTED 404 (Not Found)
localhost/:60 GET http://localhost:3000/js/plugins/oclazyload/dist/ocLazyLoad.min.js net::ERR_ABORTED 404 (Not Found)

下面是一个jQuery库的示例路径，以与404错误之一进行对比：

/Users/e602684/Documents/dev/monster/Angular_Full_Version/js/jquery/jquery-2.1.1.min.js

这是我的index.html：

<!--
*
* INSPINIA - Responsive Admin Theme
* Version 2.7.1
*
-->

<!DOCTYPE html>
<html ng-app="inspinia">

<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">

    <!-- Page title set in pageTitle directive -->
    <title page-title></title>

    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">

    <!-- Font awesome -->
    <link href="font-awesome/css/font-awesome.css" rel="stylesheet">

    <!-- Main Inspinia CSS files -->
    <link href="css/animate.css" rel="stylesheet">
    <link id="loadBefore" href="css/style.css" rel="stylesheet">


</head>

<!-- ControllerAs syntax -->
<!-- Main controller with serveral data used in Inspinia theme on diferent view -->
<body ng-controller="MainCtrl as main" class="{{$state.current.data.specialClass}}" landing-scrollspy id="page-top">

<!-- Main view  -->
<div ui-view></div>

<!-- jQuery and Bootstrap -->
<script src="js/jquery/jquery-3.1.1.min.js"></script>
<script src="js/plugins/jquery-ui/jquery-ui.min.js"></script>
<script src="js/bootstrap/bootstrap.min.js"></script>

<!-- MetsiMenu -->
<script src="js/plugins/metisMenu/jquery.metisMenu.js"></script>

<!-- SlimScroll -->
<script src="js/plugins/slimscroll/jquery.slimscroll.min.js"></script>

<!-- Peace JS -->
<script src="js/plugins/pace/pace.min.js"></script>

<!-- Custom and plugin javascript -->
<script src="js/inspinia.js"></script>

<!-- Main Angular scripts-->
<script src="js/angular/angular.min.js"></script>
<script src="js/angular/angular-sanitize.js"></script>
<script src="js/plugins/oclazyload/dist/ocLazyLoad.min.js"></script>
<script src="js/angular-translate/angular-translate.min.js"></script>
<script src="js/ui-router/angular-ui-router.min.js"></script>
<script src="js/bootstrap/ui-bootstrap-tpls-1.1.2.min.js"></script>
<script src="js/plugins/angular-idle/angular-idle.js"></script>

<!--
 You need to include this script on any page that has a Google Map.
 When using Google Maps on your own site you MUST signup for your own API key at:
 https://developers.google.com/maps/documentation/javascript/tutorial#api_key
 After your sign up replace the key in the URL below..
-->
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDQTpXj82d8UpCi97wzo_nKXL7nYrd4G70"></script>

<!-- Anglar App Script -->
<script src="js/app.js"></script>
<script src="js/config.js"></script>
<script src="js/translations.js"></script>
<script src="js/directives.js"></script>
<script src="js/controllers.js"></script>

</body>
</html>

我该怎么做才能使这项工作成功？