如何将 Polymer (1.0) 与 Rails (4) 一起使用？

Question

现在 Polymer (1.0) "Production Ready" 在 Rails (4) 上使用它的最佳方式是什么？

我读了很多书，发现所有的解决方案都被弃用了，（例如使用像这样的 Gems：likepolymer-rails、emcee 等）

我迷失了为项目创建一个好的结构，以及包含所有聚合物组件的方法，我也不知道 Sprocket 是否有帮助。

Answer 1

您可能会发现 Rails Assets 是将此添加到您的应用程序的好方法。

Rails Assets 是 Bower 的代理，用于从现有前端 Javascript 库生成 gems 并代表您通过以下方式安装它们bundler/your 宝石文件。这打破了您对 gem 打包程序的依赖，使前端 Javascript 库保持最新。

基本上你会把这个添加到你的 Gemfile 中：

source 'https://rails-assets.org' do
  gem 'rails-assets-polymer'
end

然后运行 bundle install（确保捆绑器版本为 1.8.4 或更高版本，否则无法使用上述代码段）

最后，在application.js的适当位置添加//= require polymer。

Answer 2

几个月前我尝试过聚合物，希望这可以帮助你了解

在 GemFile

gem 'rails', '4.0.2'
gem 'polymer-rails'
gem 'polymer-core-rails'
gem 'polymer-paper-rails'

在app/assets/components/application.html.erb

 //= require polymer/polymer

在app/assets/javascripts/application.js

//= require polymer/platform

您显示 .bowerrc 个文件，内容如下

{
 "directory": "vendor/assets/components"
}

使用 polymar 渲染的示例视图

     <style>
         google-map {
             display: block;
             height: 600px;
         }
     </style>

     <h1>Polymer Rails Example</h1>

     <google-map latitude="37.77493" longitude="-122.41942" fitToMarkers>
       <google-map-marker latitude="37.779" longitude="-122.3892"  draggable="true" title="Go Giants!"></google-map-marker>
       <google-map-marker latitude="37.777" longitude="-122.38911"></google-map-marker>
     </google-map>

     <google-map disableDefaultUI showCenterMarker zoom="15"></google-map>
     <script>
         var map = document.querySelector('google-map');
         map.latitude = 37.77493;
         map.longitude = -122.41942;
         map.addEventListener('google-map-ready', function(e) {
             alert('Map loaded!');
         });
     </script>

你可以看看我使用 ploymer 的项目，不是一个很好的编码，但你仍然可以从这个提交中得到一个想法 Github Repository

Answer 3

更新 （2015 年 6 月 16 日）：官方包 已发布 polymer-rails。请参阅 polymer-elements-rails，这是新的官方存储库，其中包括 iron-、paper- 和 neon-elements。

我会暂时为可能仍将它们设置为依赖项的任何人保留这些分支，但是您将通过使用官方存储库获得相同的功能和长期支持，因此 如果你还没有，我敦促你切换。

polymer-rails项目已经更新到1.0，可惜组件的gem还没有。我已经继续并创建了适当的分支，以便同时有一些工作选项。

你的 gemfile 应该有：

gem 'polymer-rails'
gem 'polymer-iron-rails', :git => "git://github.com/vsimonian/polymer-iron-rails.git"
gem 'polymer-paper-rails', :git => "git://github.com/vsimonian/polymer-paper-rails.git"
gem 'polymer-neon-rails', :git => "git://github.com/vsimonian/polymer-neon-rails.git"

然后运行bundle.

在 app/assets/components/application.html.erb 中，您设置依赖项：

//= require polymer/polymer
//= require iron-ajax/iron-ajax
//= require iron-input/iron-input
.....

app/assets/javascripts/application.js 应包含：

//= require webcomponentsjs/webcomponents-lite

您的 .bowerrc 应该设置第 3 方组件目录：

{
  "directory": "vendor/assets/components"
}

Answer 4

polymer-elements-rails gem 的创建是因为没有 sense/possibility 将它们分成不同的 gem，因为所有这些组件都具有循环依赖性。因此，几乎不建议切换到此 gem 而不是使用已弃用的 polymer-paper-rails、polymer-iron-rails 等。它们永远不会更新 Polymer 1.0。

如何将 Polymer (1.0) 与 Rails (4) 一起使用？

How to use Polymer (1.0) with Rails (4)?

ruby-on-rails

web-component

ruby-on-rails-4

polymer