如何使用Require.js在特定页面上加载特定脚本？

Question

我正在开发一个Jekyll多页面html项目，并希望在主页上加载jQuery + Carousel js文件，但只在联系页面上加载jQuery js文件。我如何利用Require.js为我做这个？

Answer 1

通过使用Jekyll确定包含哪些脚本而不是使用JS来确定它们，您可以更有效地完成此任务。

您可以使用每页变量（例如scripts）来指定要加载的脚本。

对于主页，您有：

---
scripts:
 -  jquery
 - carousel
---

对于联系页面，您有：

---
scripts
 - jquery
---

然后，在您添加<script>代码的位置，您将遍历scripts变量并为每个项目输出一个标记。

{% for script in page.scripts %}
    <script src="/vendor/js/{{ script }}.js"></script>
{% endfor %}

在此示例中，脚本存储在/vendor/js/jquery.js和/vendor/js/carousel.js中。您当然可以更改脚本标记中的文件夹路径或scripts变量中的文件名。