Question

以下文件夹结构已用于测试。 js和css位于pages上方的目录中，因此它们可以包含在pages目录中的所有嵌套页面中。在页面文件夹中运行命令http-server时，无法通过HTTP找到脚本和样式表。

是否有更好的方法来组织这些文件？目的是在通过HTTP测试时将样式表和脚本放在所有页面都可以访问的位置。

该项目正在使用http-server npm模块。

文件结构

.
+-- css
|   +-- styles.css
+-- js
|    +-- jquery.js
|    +-- popper.js
|    +-- bootstrap.js
+-- pages
|   +-- admin
|       +-- admin-page.html
|   +-- user
|       +-- user-page.html
|   +-- index.html

index.html

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <link rel="stylesheet" href="../css/style.css" />

    <title>Loading scripts and styles through HTTP</title>
  </head>
  <body>
    <script src="../js/jquery.js"></script>
    <script src="../js/popper.js"></script>
    <script src="../js/bootstrap.js"></script>
  </body>
</html>

Answer 1

在http-server文件夹中运行命令pages时，该文件夹将成为webroot。您无法访问webroot之外的任何文件或文件夹。因此，要访问js和css文件，您需要将它们移到pages文件夹内。当然，您仍然可以使用文件夹。

还要确保更改html文件中的路径，最好使用来自Webroot的绝对路径。

注意：可能有一些配置选项可让您访问webroot之外的特定文件或文件夹，但我不知道http-server模块中的任何文件或文件夹。

为什么脚本和样式表不能通过HTTP加载？

1 个答案: