Добавьте фрагмент Google Tag Manager в <head>в EmberJS - PullRequest
0 голосов
/ 28 мая 2020

У меня есть несколько проектов Ember в одном репо, и я хотел бы иметь возможность повторно использовать фрагмент GTM во всех своих .html файлах.

<!DOCTYPE html>
<html lang="en">
  <head>

    {{content-for "head"}}

    <link rel="stylesheet" href="assets/employer-vendor.css">
    <link rel="stylesheet" href="assets/employer.css">
  </head>
  <body>
  </body>
</html>

Стоит ли использовать ember-cli-meta-tags, ember-cli-inline-content или похожие? Чтобы фрагмент можно было использовать повторно, его необходимо сохранить не в ember-cli-build.js, поскольку он находится в рамках конкретного проекта c, а в общей папке по всем направлениям.

1 Ответ

0 голосов
/ 29 мая 2020

Это отличный вариант использования для написания Ember Addon .

Ember Addon позволяет вам настраивать конвейер сборки. Они предоставляют для этого несколько крючков. Эти хуки должны быть реализованы в index.js файле аддона. Синтаксис этого файла в наши дни немного необычен. Он очень старый и еще не модернизирован. Существует постоянная инициатива по замене этого формата новым форматом , но он пока нестабилен.

Хук, который вы ищете, - contentFor. Он позволяет вставлять контент в заполнители {{content-for}} в app/index.htmltests/index.html). Хук получает тип в качестве первого аргумента, который отображается на первый аргумент для {{content-for}}. Второй и третий аргументы дают вам доступ к конфигурации и существующему контенту, но оба они не нужны для вашего варианта использования. Вы должны вернуть из него HTML, которое должно быть введено в этот хук.

Использование хука для вашего варианта использования может выглядеть следующим образом:

// index.js

'use strict';

module.exports = {
  name: require('./package').name,

  contentFor(type) {
    if (type === "head") {
      return "a string with Google Tag Manager snippet";
    }
  }
};

Вы можете реализовать это как надстройка в репозитории , а затем извлеките его в отдельный пакет для повторного использования в нескольких приложениях.

...