26

Javascript 依赖项在我的 Rails 应用程序中不断增长，这导致了一些问题。一方面，有这么多，很难跟踪和更新不同 Javascript 库的版本。起初我尝试将它们变成 gems，但后来我必须管理它们。有些已经是宝石（如骨干轨），但我希望有一个一致的包管理器。

所以我正在研究Bower，“网络包管理器”。来自 kaeff和af83的一些博客文章很有帮助，但我仍然遇到问题。我希望这个问题可以引出人们可以用来为他们的项目找到最佳解决方案的各种答案。

我特别希望看到在 Heroku 部署中通过 Bower 管理资产的建议。

4

5 回答 5

27

一种方法是使用 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. 该 gem 还提供了一些 Rake 任务，但它们只做基本的 Bower 命令。

据我所知，还没有办法在资产编译期间根据需要安装 Bower。因此，如果您使用的是 Heroku 之类的部署环境，则需要提交您的vendor/assets/components目录并通过bower命令对其进行更新。

如果你能要求你的整个 Bower 依赖集在application.js. 来自 kaeff的要点说明了如何创建require_bower_dependencies指令。还没有宝石可以为您做到这一点。bower.json在此之前，您必须在和中声明每个依赖项application.js。

于 2013-04-28T18:58:08.713 回答
15

结帐Rails 资产项目。使用示例：

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)
Rails-Assets 项目的未来正在讨论中。请检查线程并做出自己的决定：使用它或找到解决方法。

于 2014-01-03T12:18:40.573 回答
8

刚刚写了一个关于 Rails+Bower+Heroku 的指南。希望有帮助。

于 2013-06-04T06:54:23.327 回答
5

最近几天我一直在解决这个问题，并确定了以下过程。

使用bower-rails gem。它提供了许多不错的 rake 任务，有助于将 bower 的使用与 rails 应用程序和资产管道集成。我更喜欢使用 bower.json 配置，而不是 bower-rails 提供的基于 ruby​​ 的 DSL。我坚持将资产存储在 vendor/assets/bower_components 中的默认 bower 位置。确保将以下内容添加到您的 application.rb。

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

将包添加到 bower.json 后，运行以下命令：

rake bower:install

安装你的 javascript 包。然后在 application.js 和 application.css 文件中引用 javacript。

正如@andrew-hacking 上面提到的那样，rails 和 bower 不能很好地与具有 css 和图像的 javascript 包配合使用，特别是引用图像的 css。Bower-rails 通过提供的 rake 任务帮助解决此问题：

rake bower:resolve

它通过使用 rails helper 方法重写组件 css 文件中的 url 引用以资产管道友好的方式引用资产来解析组件中的相对资产路径。有关详细信息，请参阅BowerRails::Performer#resolve_asset_paths。

我的偏好是将所有 bower_components 签入到我们的存储库中，因此我们运行 bower:install，然后运行 ​​bower:resolve。然后，您需要将包中引用的图像添加到 config.assets.precompile 列表中，以用于您的登台和生产环境。例如，这里是使用 bower 和 rails 将select2 javascript 组件添加到您的 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/environments/staging.rb 和 config/environments/production.rb：

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

它并不完美，但它为您提供了 javascript 组件的依赖管理，并且最好尝试找出您需要拉入哪些 gem 才能为资产管道启用所需的 javascript 组件。

于 2014-08-08T05:47:11.423 回答
1

如果其他人认为在您的 Rails 项目中使用 bower 是个好主意，请再想一想。

Bower 包装根本不适合与导轨或链轮集成。

这意味着什么：

  • 他们通常不会指定清单 index.js 来通过 sprocket 需要指令来包含您的 javascript。
  • 您将不得不在 bower 包中分析和搜索，并准确计算出您需要什么以及从哪里来（您的需求路径有点长）
  • bower 包没有统一指定主键，即使他们这样做，当前的 sprockets/bower 支持似乎也忽略了它们
  • 其他资源，如字体、图像和模板不会包含在您的生产资源编译中（Rails 4 仅包括 app/assets/xxx）
  • 使用 config.assets.precompile 模式尝试“解决”问题是粗粒度的，并且会在您的凉亭组件目录中找到很多垃圾
  • bower 包不会使用 sprocket url 路径助手，因此 CSS/SCCS 中对图像和字体的任何引用都不会具有正确的资产路径。祝你好运。
  • 您必须解决使用 bower 包的每个项目中的所有问题
  • bundle install不再适用于您的项目依赖项，您还必须使用另一个包管理器

相比之下，资产 gem 易于创建，并为将资产拉入项目提供统一的抽象。您有机会修改原始文件并使用资产助手，以便在您的 Rails 项目中正常工作。有一个关于创建资产 gem 的不错的博客，以及一个关于创建 gem 的通用railscast。

IMO 对于 Rails 社区来说，维护最新的资产宝石比每个项目都必须处理从未设计用于插入 Rails 资产管道的 Bower 包的问题会更好。

于 2013-11-15T06:24:01.933 回答