Question

我总是在找到正确的脚本路径时遇到问题，这一定是因为我提供静态文件的方式，因为我的路径是正确的。在我的代码中，我试图包含物化框架，但它没有找到，我不明白为什么。我在/ browser

中提供我的文件

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

来自browser / index.html的

我使用（我相信）正确的路径，但它不起作用。任何帮助都会很棒，所以我不会犯同样的错误！非常感谢你！

航班/服务器/ app.js

    var express = require('express');
    var path = require('path');
    var morgan = require('morgan');
    var bodyParser = require('body-parser');

    var app = express();
    module.exports = app;
    app.use(morgan('dev'));


    app.use(express.static(path.join(__dirname, '../browser')));
    app.use(bodyParser.urlencoded({
        extended: false
    }));
    app.use(bodyParser.json());

    var PORT = process.env.PORT || 1337;
    app.listen(PORT, function() {
        console.log('Server is listening on port 1337!');
    });

航班/浏览器/ index.html中

<!DOCTYPE html>
    <html>
    <head>
        <title>Title of the document</title>
        <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no">
        <link rel="stylesheet" type="text/css" href="../css/style.css" />
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
        <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
        <link type="text/css" rel="stylesheet" href="../materialize/css/materialize.min.css" media="screen,projection" />
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
        <script type="text/javascript" src="../materialize/js/materialize.min.js"></script>
        <script src="flight.js"></script>
    </head>

    <body>
        The content of the document......
    </body>
    </html>

我的结构：

flights
   browser
      index.html
      flights.js
   server
      app.js
   css
     style.css
   materialize
      css
         materialize.min.css
      fonts
      js
         materialize.min.js

Answer 1

首先要了解的是，您需要将所有静态文件（如css，js）放在一个文件夹中，该文件夹可以分别包含css和js以及其他内容的子文件夹。

您的结构应该是根项目目录中的public这样的单个文件夹，然后在该公共文件夹中放置css，js等文件夹。

也是这一行

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

不完全正确。使用类似这样的东西

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

public是包含所有静态文件的文件夹

现在假设您将一个materialize文件夹放在包含一些materialise.css文件的css文件夹中，那么URL将类似于 http://localhost:3000/css/materialize/materialise.css

另请查看express static files

使用node express提供静态文件时，正确的脚本路径是什么？

1 个答案: