如何在index.html中的assets文件夹中设置文件

时间:2017-12-22 06:52:16

标签: javascript css node.js express

我有一个像下面这样的文件夹结构

  • 角-SRC
    • SRC
      • 的index.html
  • 自举
  • CSS
  • app.js

在我的app.js文件中,我将此静态文件夹设置为:

// Set Static Folder
app.use(express.static(path.join(__dirname, 'public')));

我想在index.html中设置css和bootstrap文件。

这是index.html档案:

<!DOCTYPE html>
<html>
  <head>
    <title>Alpha Theme</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- jQuery UI -->
    <link href="https://code.jquery.com/ui/1.10.3/themes/redmond/jquery-ui.css" rel="stylesheet" media="screen">
    <!-- Bootstrap -->
    <link href="./bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <!-- styles -->
    <link href="./css/styles.css" rel="stylesheet">
    <link href="./css/stats.css" rel="stylesheet">
</head>
<body>
  <app-root>Loading...</app-root>
  <footer>
    <div class="container">
       <div class="copy text-center">
          Copyright 2014 <a href='#'>Website</a>
       </div>
    </div>
 </footer>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://code.jquery.com/jquery.js"></script>
<!-- jQuery UI -->
<script src="https://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="./bootstrap/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="./vendors/morris/morris.css">
<script src="./vendors/jquery.knob.js"></script>
<script src="./vendors/raphael-min.js"></script>
<script src="./vendors/morris/morris.min.js"></script>
<script src="./vendors/flot/jquery.flot.js"></script>
<script src="./vendors/flot/jquery.flot.categories.js"></script>
<script src="./vendors/flot/jquery.flot.pie.js"></script>
<script src="./vendors/flot/jquery.flot.time.js"></script>
<script src="./vendors/flot/jquery.flot.stack.js"></script>
<script src="./vendors/flot/jquery.flot.resize.js"></script>
<script src="./js/custom.js"></script>
<script src="./js/stats.js"></script>
</body>
</html>

1 个答案:

答案 0 :(得分:1)

对于目录结构:

  • 对当前目录使用单点(。)
  • 使用双点(..)跳出当前目录

现在回答您的问题,在index.html中设置您的css和bootstrap文件的路径:

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