时间戳

首页 > 解决方案 > 跨项目文件夹链接css，js文件

javascript - 跨项目文件夹链接css，js文件

问题描述

我有一个香草项目，我在其中导入了我将要使用的基本框架，如 js、Bootstrap 等。

我有一个像这样的索引文件，

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script type="text/javascript" src="frameworks/jquery.js"></script>
    <script type="text/javascript" src="frameworks/p5.js"></script>

    <link href="frameworks/bootstrap/css/bootstrap.css" rel="stylesheet">
    <script type="application/javascript" src="frameworks/bootstrap/js/popper.js"></script>
    <script type="application/javascript" src="frameworks/bootstrap/js/bootstrap.js"></script>
</head>
<body>

Hello, foo!

</body>
</html>

如果我要拥有多个 html 文件，例如 bar.html foo.htmlm，我需要在该文件中再次链接所有文件，这将是忙碌的。对此有什么解决方案？如何只导入一次并在所有 .html 文件中使用？

标签： javascripthtmlcss

解决方案

您需要使用像Handlebars、EJS或Swig这样的模板引擎。我会从这些建议中推荐 EJS。这些模板引擎有一个您想要使用的称为“部分”的概念。

这是关于EJS partials的 Stack Overflow 问题。从本质上讲，partials 允许您在模板中使用较小的模板。因此，您可以创建一个名为“header.html”的部分并将其包含多个模板，如“home.html”或“article.html”。

推荐阅读