Развертывание приложения Ember с помощью Addon на страницах Github

Моя организация использует дополнения Ember для разработки набора общих компонентов между нашими приложениями. Давайте назовем этот репозиторий app-components, В настоящее время основной задачей приложения компонентов является распространение CSS, шрифтов и изображений.

Мы также создаем живое руководство по стилю, которое будет принимать наши общие компоненты и представлять их нейтральным образом для разработчиков. Давайте назовем этот репозиторий app-styleguide, Наша цель - развернуть app-styleguide с помощью ember-deploy развернуть это решение на Github Pages. URL следует этому шаблону:

https://organization.github.io/app-styleguide/

Когда app-styleguide приложение делает это в gh-pages филиал и служит веб-страницей, все шрифты и изображения доставляются app-components дают нам 404. Я ссылался на несколько различных решений этой проблемы, но я продолжаю сталкиваться с теми же решениями, которые мы пробовали.

Я попытался использовать следующие два дополнения ember, которые автоматизируют развертывание на страницах github:

  1. https://github.com/poetic/ember-cli-github-pages
  2. https://www.npmjs.com/package/ember-cli-deploy-gh-pages

В итоге мы выбрали ванильное решение http://ember-cli-deploy.com/, поскольку эти два дополнения довольно старые...

Я следовал инструкциям здесь, чтобы добавить rootUrl and locationType properties to our Файл environment.js, который не работал:

Наш файл environment.js выглядит так:

if (environment === 'production') {
    ENV.rootURL = '/app-styleguide';
    ENV.locationType = 'hash';
  }

И наши запросы продолжают не добавлять app-styleguide на URL запроса для активов, поступающих из аддона. Вот пример неудачного запроса на вкладке Chrome DevTools Network:

Request URL:https://organization.github.io/assets/images/thumbnail-icons/person.svg
Request Method:GET
Status Code:404 Not Found

Как вы видете, app-styleguide не добавляется в запрос.

Любая помощь очень ценится!

1 ответ

Решение

Мне удалось получить некоторую помощь в сообществе Ember Slack (особая благодарность @alexspeller). Оказывается, мне нужно было обновить пару настроек при снятии отпечатков с активов.

Используя включенный broccoli-asset-rev библиотека я должен был изменить мой ember-cli-build.js включить следующее:

var app = new EmberApp(defaults, {
    fingerprint: {
      extensions: ['js', 'css', 'png', 'jpg', 'gif', 'map', 'svg', 'ttf', 'woff'],
      prepend: '/app-styleguide/'
    }
  });

Мне нужно было обновить опции, чтобы учесть SVG, TTF и WOFF, а также соответствующий предварительно добавленный сегмент URL.

Вы можете прочитать о функциональности здесь: https://ember-cli.com/asset-compilation

Доступные варианты: https://github.com/cibernox/broccoli-asset-rev?files=1

Другие вопросы по тегам