Развертывание приложения 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:
- https://github.com/poetic/ember-cli-github-pages
- 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