Shopify API - ScriptTag 依赖管理？答案

【问题标题】：Shopify API - ScriptTag dependency management?Shopify API - ScriptTag 依赖管理？
【发布时间】：2012-08-19 15:17:18
【问题描述】：

我有一个 Shopify 应用程序，它在安装后立即通过 API 添加ScriptTag。该脚本依赖于 jQuery 和 Shopify jQuery AJAX 库。如果可能，我想避免强迫商家编辑多个主题文件。

据我所知：

不能保证这些依赖项出现在每个主题上或以正确的顺序出现。
我无法直接从 API 中引用 Shopify CDN 或主题脚本（因为它仅适用于远程脚本）。
将所有脚本标签合并到 scripts.liquid 资产中不起作用，因为 API 添加了 *.liquid 资产 only have access to the settings object。

我不情愿地倾向于单独提供一个 sn-p 并指示商家将其粘贴到 </head> 之前。

是否存在我缺少的用于使用 ScriptTag 的 Shopify 预期模式？

【问题讨论】：

标签： shopify

【解决方案1】：

我已经创建了这个示例文件作为您使用 ScriptTag 的起点：http://gist.github.com/carolineschnapp/5397337 如果 jQuery 未定义或太旧而无法满足您的需求，它将向您展示如何加载 jQuery，而不会破坏商店的主题。您需要使用 jQuery.noConflict。它可以轻松完成而不会造成附带损害。

我还写了以下内容，读起来很糟糕，可能是我文档生涯中写的最糟糕的东西，但它充满了智慧：http://docs.shopify.com/api/tutorials/using-javascript-responsibly我希望它能说服你坚持使用 ScripTag。

就加载 Shopify jQuery AJAX 库而言，我完全不会。我会使用我自己的代码和 jQuery 来做我需要做的任何事情。我不想这么说，但是使用自己的代码太简单了，确实如此。您根本不需要帮助文件，它是不必要的膨胀，并且通过使用它，您可能会遇到冲突的情况，因为主题可能也在使用它。如果一个主题使用它来 ajaxify 购物车或使用 Ajax 加载产品，它正在重新定义一些在帮助文件中定义的回调函数。您只需再次加载文件即可中断所有这些回调。人们会将商品添加到购物车，然后突然会在他们的页面上显示一个警报，或者不是通过 Ajax 在页面上加载产品，主题会突然显示一个警报，说“我们现在拥有所有信息您请求了有关产品 X 的信息”，但没有将产品添加到页面中。任何使用 jquery.api.js 的应用程序都没有任何好处。

【讨论】：

【解决方案2】：

您不能真正依赖主题中可用的任何东西，店主可以自定义他们想要的任何东西，而您几乎无法控制它。您的选择是：

要求您的客户拥有或将 jQuery 添加到他们的主题中。
用纯 JavaScript 编写代码，不依赖任何其他库。
将您需要的库嵌入到您自己的脚本中。确保将其包装在一个闭包中，这样如果他们已经拥有库，他们就不会发生冲突。

我建议自己做#3，但我可能会选择一个轻量级的库，它可以做你需要的最少的事情（即，如果你真的不需要遍历 jQuerys 选择器引擎是你可以不用的一大段代码）。如果您四处搜索，那里有很多。

【讨论】：

感谢您的参与。您的 API 路线图中是否有更灵活的 ScriptTag？如果店主安装了多个应用程序，那么所有额外/重复的库确实会拖累加载时间。
我觉得当前的脚本标签足够灵活来处理这个问题。我给了你一些直接的解决方案，你也可以先测试你选择的库是否已经存在，如果没有动态加载它。我认为这不值得，因为你还需要确保它您期望的版本等，因为主题是完全可定制的，您将遇到所有可能的库。
我创建了这个示例文件以与 ScriptTag 一起使用：gist.github.com/carolineschnapp/5397337 它展示了如果 jQuery 未定义或太旧而无法满足您的需求，如何加载 jQuery，而不会破坏主题。您需要使用 jQuery.noConflict。可以做到的。