Shopify 的 {% javascript %} 标签如何工作？答案

【问题标题】：How does Shopify's {% javascript %} tag work?Shopify 的 {% javascript %} 标签如何工作？
【发布时间】：2020-10-23 21:12:15
【问题描述】：

我无法找到有关此标签如何工作的任何信息。为什么我应该使用 {% javascript %} 而不是 HTML script 标签？有什么区别吗？我检查了描述所有其他标签的 Shopify cheatsheet，并在谷歌的几页中进行了筛选，但没有发现任何实质性内容。

【问题讨论】：

shopify.dev/docs/themes/sections#javascript-and-stylesheet-tags 这就是我在 javascript 标签上找到的。

标签： javascript shopify liquid

【解决方案1】：

如果您在主题section 上下文中添加{% javascript %} 标签，则：

部分可以使用javascript 和stylesheet 标签捆绑自己的脚本和样式资产。您应该只需要将其用于要在多个主题或商店上重复使用或安装的部分。

Shopify 将所有部分的脚本连接成一个文件并注入content_for_header。注入的<script> 设置为使用defer 属性异步加载。 javascript 标签被包裹在一个自执行匿名函数和一个 try/catch 中，这意味着变量在闭包内定义，运行时异常不会影响其他部分。

Reference

【讨论】：

这正是我正在寻找的信息。另一方面，这是否意味着 recommendation to wrap your JS code in a closure 在部分上下文中是不必要的，因为这是自动发生的？
正确！如果您打算在这种情况下使用{%.javascript %} 标签，则无需将 Js 代码包装在闭包中。

【解决方案2】：

这只是为您提供方便。它没有为您提供任何特殊功能。这很好，因为对于不太出色的技术人员，可能会得到一点 Liquid 但没有太多其他东西的人，很明显标签内的东西很可能是 Javascript。他们建议您仅在您的部分用于广泛分布的主题或许多商店时才使用这些标签。换句话说，如果您喜欢脚本标签，请继续使用它们，没有坏处。

【讨论】：