Shopify - 自动将 javascript 添加到模板 <head>答案

【问题标题】：Shopify - add automatically javascript to template <head>Shopify - 自动将 javascript 添加到模板 <head>
【发布时间】：2016-03-15 22:07:29
【问题描述】：

是否可以在应用安装过程中自动将一些 js 库添加到模板 <head> 部分？

给定我：

下载了这个仓库：https://github.com/Shopify/shopify_app
编辑config/initializers/shopify_app.rb 并添加此行config.scope = "read_orders, read_products, read_themes, write_themes"
将此行输入控制器：ShopifyAPI::Asset.create(key: 'assets/angular.js', src: 'https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.js') 其中angular.js 是我的图书馆。

我可以在模板中使用 Angular，但我必须在 <head> 部分添加此代码 {{ 'angular.js' | asset_url | script_tag }}。我可以在应用安装期间自动添加此代码吗？

【问题讨论】：

标签： shopify

【解决方案1】：

在config/initializers/shopify_app.rb 下，您必须向 csope 参数添加您需要的权限。 config.scope = "read_orders, read_products, read_themes, write_themes, write_script_tags, read_script_tags"
在这种情况下，我们需要write_script_tags。之后，您必须从 cotroller 添加一些脚本，例如：

st = ShopifyAPI::ScriptTag.new(:src => "https://rawgit.com/someurl/10a5bf06d1b77a871426/raw/40a5c536453783d8b2b5ec3705ec13688bd3407c/widget.js", :event => "onload")
st.save

您的 js 文件可能如下所示：

  (function () {
    'use strict';

    var matches = document.getElementsByTagName("someTag")[0];
    console.log(matches);

  }());

【讨论】：