Подтвердить что ты не робот

Как управлять зависимостями Javascript с приложениями Bower in Rails?

Зависимости Javascript растут в моем приложении Rails, и это приводит к некоторым проблемам. Во-первых, с таким количеством становится сложно отслеживать и обновлять версии различных библиотек Javascript. Сначала я попробовал превратить их в драгоценные камни, но потом мне нужно управлять ими. Некоторые из них уже являются драгоценными камнями (например, позвоночниками), но я хотел бы иметь один последовательный менеджер пакетов.

Итак, я смотрю Bower, "менеджер пакетов для Интернета". Некоторые сообщения в блоге от kaeff и от af83 были полезны, но я все еще сталкиваюсь с проблемами. Я надеюсь, что этот вопрос может привести к множеству ответов, которые люди могут использовать, чтобы найти лучшее решение для своих проектов.

Мне особенно хотелось бы получить рекомендации по управлению активами через Bower в развертывании Heroku.

4b9b3361

Ответ 1

Один из способов - использование версии Sprockets, которая позволяет вашим application.js требовать пакеты, определенные Bower. Эта функция была добавлена ​​в Sprockets 2.6, в которой Rails 3.x не позволит вам связывать из-за ограничения версии. Чтобы получить эту функцию, вы можете связать gem "sprockets", "2.2.2.backport1".

Это заставит Sprockets начать поиск активов в vendor/assets/components тоже. Путь - это поставщик/компоненты, потому что Bower-пакеты могут содержать CSS или изображения, а не только Javascript. То, как Sprockets знает, что включить Javascript, когда вам требуется пакет, можно прочитать файл bower.json для свойства main, в котором указывается, какие файлы должен содержать конвейер. Получается, что многие пакеты Bower не предоставляют это свойство или не предоставляют основные источники, которые предполагают, что RequireJS доступен (например, d3). Вы можете видеть, какие основные источники определены с помощью bower list --map.

Когда main вам не подходит, вы можете просто использовать Bower для управления одним удаленным JS файлом вместо пакета. Josh Peek имеет суть, которая демонстрирует это. Последняя версия Bower ожидает bower.json вместо component.json, поэтому я обновил следующие шаги:

$ npm install -g bower
$ mkdir -p vendor/assets
$ cd vendor/assets/
$ curl https://raw.github.com/gist/3667224/component.json > bower.json
$ bower install

Этот конкретный bower.json загружает jQuery. Затем в application.js вы можете просто //= require jquery, а Sprockets найдут его в vendor/assets/components. Чтобы добавить новые зависимости, просто добавьте их в свой bower.json и снова запустите bower install, например:

{
  "dependencies": {
    "jquery": "http://code.jquery.com/jquery-1.8.1.js",
    "d3": "http://cdnjs.cloudflare.com/ajax/libs/d3/3.0.8/d3.js"
  }
}

Если вы хотите управлять активами lib и vendor в одном файле конфигурации, вы можете использовать bower-rails, но там не так много смысла при использовании lib. Этот камень также предоставляет некоторые задачи Rake, но они не делают ничего больше, чем основные команды Bower.

Насколько мне известно, еще нет возможности установить Bower при необходимости во время компиляции активов. Поэтому, если вы используете среду развертывания, такую ​​как Heroku, вам необходимо зафиксировать свой каталог vendor/assets/components и обновить его с помощью команды bower.

Было бы неплохо, если бы вы могли потребовать, чтобы весь набор зависимостей Bower был установлен с одной директивой в application.js. A gist from kaeff иллюстрирует, как создать директиву require_bower_dependencies. Там нет камня, который делает это для вас еще. До тех пор вы должны объявлять каждую зависимость как в bower.json, так и application.js.

Ответ 2

Оформить заказ Проект Rails Assets. Пример использования:

source 'http://rubygems.org'
source 'https://rails-assets.org'

# gem 'rails-assets-BOWER_PACKAGE_NAME'
gem 'rails-assets-jquery', '~> 1.10.2'
gem 'rails-assets-sly', '~> 1.1.0'
gem 'rails-assets-raphael', '~> 2.1.0'

UPD (26.01.2016)
Проект Future Rails-Assets находится на обсуждении. Пожалуйста, проверьте поток и сделайте свое собственное решение: используйте его или найдите обходной путь.

Ответ 3

Просто написал руководство для выполнения Rails + Bower + Heroku. Надеюсь, что это поможет.

Ответ 4

Я работаю над этой проблемой в течение последних нескольких дней и решил следующий процесс.

Используйте bower-rails gem. Он обеспечивает ряд хороших задач рейка, которые помогают интегрировать использование беседки с использованием приложения rails и конвейера активов. Я предпочитаю придерживаться конфигурации bower.json, а не DSL на основе Ruby, предоставляемой ресиверами. Я придерживаюсь местоположения привязки по умолчанию, в котором хранятся активы в поставщиках/активах/bower_components. Обязательно добавьте следующее к вашему application.rb.

config.assets.paths <<  Rails.root.join("vendor","assets","bower_components")

После того, как вы добавили пакеты в ваш bower.json, выполните следующие действия:

rake bower:install

чтобы установить ваши пакеты javascript. Затем вы ссылаетесь на javacript в файлах application.js и application.css.

Как отмечалось выше, и рельсы и револьверы не очень хорошо сочетаются с пакетами javascript, которые имеют css и изображения, в частности css, который ссылается на изображения. Bower-rails помогает в устранении этой проблемы с заданной рейк-задачей:

rake bower:resolve 

Он разрешает относительные пути ресурсов в компонентах путем перезаписи ссылок URL-адресов в файлах компонента css с помощью метода помощников rails для ссылки на актив в дружеском пути к ресурсам. Подробнее см. BowerRails:: Performer # resolve_asset_paths.

Мое предпочтение заключается в проверке всех элементов bower_components в нашем репозитории, поэтому мы запускаем bower: install, а затем bower: resolve. Затем вам нужно добавить изображения, указанные в пакете, в свой список config.assets.precompile для вашей промежуточной и производственной среды. Например, здесь приведена установка для добавления компонента javacript select2 в ваш проект rails с использованием бесед и рельсов.

bower.json:

{
    "name": "Acme",
    "private": true,
    "dependencies": {
        "select2": "3.5.1"
    }
}

Приложение/активы/JavaScripts/application.js.coffee:

#= require select2/select2

Приложение/активы/таблицы стилей /application.css.sass

//= require select2/select2

config/environment/staging.rb и config/environment/production.rb:

config.assets.precompile += ["select2/*.png",
                            "select2/*.gif"]

Это не идеально, но он дает вам управление зависимостями ваших компонентов javascript, и лучше, чем пытаться выяснить, какие камни вам нужны, чтобы получить желаемый компонент javascript для конвейера активов.

Ответ 5

В случае, если кто-то другой подумает, что использование беседки в вашем рельсе - хорошая идея, подумайте еще раз.

Пакеты Bower просто не предназначены для интеграции с рельсами или звездочками.

Что это значит:

  • они обычно не будут указывать манифест index.js для включения вашего javascript через звездочки, требующие директив.
  • Вам нужно будет анализировать и перемещаться в пакете bower и разрабатывать именно то, что вам нужно, и от того, где (ваши пути требуют длинного пути)
  • Пакеты bower не дают равномерного указания основного ключа, и даже если они выполняют текущую поддержку звездочек/опорных устройств, они игнорируют их.
  • дополнительные средства, такие как шрифты, изображения и шаблоны, не будут включены в вашу компиляцию производственных активов (Rails 4 включает только приложение/активы/xxx).
  • Использование шаблонов config.assets.precompile, чтобы попытаться "обойти" проблему, имеет грубую зернистость и будет захватывать множество трещин в ваших каталогах компонентов bower.
  • Пакеты bower не будут использовать помощники URL-адреса звездочки, поэтому любые ссылки на изображения и шрифты в CSS/SCCS не будут иметь правильный путь к ресурсам. Удачи вам в этом.
  • вам нужно будет решить все проблемы в проекте КАЖДЫЙ, где вы используете пакеты bower
  • bundle install больше не работает для зависимостей ваших проектов, и вам также нужно использовать другой менеджер пакетов.

В отличие от драгоценных камней объектов просто создать и обеспечить единую абстракцию для вытягивания активов в ваш проект. У вас есть возможность изменить исходные файлы и использовать помощники активов, чтобы все хорошо работало с вашими проектами rails. Существует приличный blog для создания драгоценных камней активов, а также общий railscast для создания драгоценных камней.

ИМО. Было бы лучше, если сообщество рельсов будет поддерживать обновленные драгоценные камни, чем каждый проект, имеющий дело с проблемами пакетного оборудования, которое никогда не предназначалось для подключения к конвейеру ресурсов рельсов.