Развертывание приложения Ember с надстройкой на Github Pages

Моя организация использует надстройки 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

В конце концов мы остановились на ванильном решении ember-cli-deploy, так как эти два дополнения довольно старый...

Я выполнил приведенные здесь инструкции, чтобы добавить файл rootUrl andlocationTypeproperties to ourenvironment.js`, который не сработал:

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

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

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

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

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

Любая помощь приветствуется!


github-pages ember.js ember-cli ember-addon
person robabby    schedule 10.07.2017    source источник
comment
Где вы ссылаетесь на person.svg?   -  person Lux    schedule 10.07.2017

Ответы (1)


arrow_upward
1
arrow_downward

Мне удалось получить некоторую помощь в сообществе 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#fingerprinting-and-cdn-urls

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

person robabby    schedule 10.07.2017