Bootstrap node.js 项目中的主题资产管理与快速路线

Question

我来自 PHP 背景并使用 bootstrap 框架一段时间，目前正在研究 Node.js and express with routes 项目。我很难理解如何在视图 (index.html) 中调用项目资产（js、css、图像等）。

用于包含像 (index.php)

中的文件

<script src="../assets/global/plugins/jquery.min.js" type="text/javascript"></script>
<script src="../assets/global/plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>

我在 Node.js 中尝试过类似的方法，但在使用路由时似乎并不直接。

我经历了几次 SO1 来理解这个概念，但不能。

我的index.js

var express = require("express");
var app = express();
var router = express.Router();
var path = __dirname + '/views/';

router.use(function (req,res,next) {
  console.log("/" + req.method);
  next();
});

我的index.html

<script src="../assets/jquery.min.js"></script>

上面的方法没有用所以我跟着SO2问题

app.use('/assets', [
    express.static(__dirname + '/node_modules/jquery/dist/'),
    express.static(__dirname + '/node_modules/materialize-css/dist/'),
]);

<script src="/assets/jquery.min.js"></script> //in template

什么是更好的方法，因为我将拥有资产（jquery、bootstrap css、自定义脚本等）。

Answer 1

在我的项目中向前推进，我使用以下方法将所有资产包含在视图中。

var express = require("express");
var app = express();
var router = express.Router();
var path = __dirname + '/views/';


    router.use(function (req,res,next) {
        console.log("/" + req.method);
        next();
      });

      app.use('/assets', [
        express.static(__dirname + '/assets/'),
      ]);

      router.get("/",function(req,res){
        res.sendFile(path + "");
      });

      app.use("/",router);

      app.use("*",function(req,res){
        res.sendFile(path + "404.html");
      });

然后通过在视图文件中调用它们（在 index.html 中），例如

<script src="assets/global/plugins/jquery.min.js" type="text/javascript"></script>
<script src="assets/global/plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>

Bootstrap node.js 项目中的主题资产管理与快速路线

Bootstrap theme's assets management in node.js project with express routes

javascript

node.js

express

express-router