带有导轨的Google Polymer 4 [英] Google Polymer with rails 4

问题描述

我已经构建了一个Ruby on Rails应用程序.我想在我的ruby on rails应用程序中使用聚合物.有人会建议一些好的资源来学习带轨道的聚合物吗?

I have build a Ruby on rails app.I want to use polymer with my ruby on rails app. Cam anybody suggest some good resources to learn polymer with rails ?

在轨道上使用带有红宝石的聚合物是否有效? 还请提出其他比聚合物更好的选择，如果有的话?

Is it efficient to use polymer with ruby on rails ? Please also suggest other better options than polymer, if any ?

推荐答案

我正在使用Bower，所以我希望您已经在系统上安装了Bower. (酿造安装节点&& npm安装弓箭手)

I am using bower, so I expect you already have bower setup on your system. (brew install node && npm install bower)

1. 设置您的宝石

1. Set up you gems

gem 'bower-rails'
gem 'emcee'

bundle install

rails g bower_rails:initialize

rails g emcee:install

设置您的凉亭文件.下面是我的样子:

Setup your bower file. Below is what mine looks like:

asset 'angular'
asset 'angular-route'
asset 'angular-resource'
asset 'angular-mocks'

asset 'webcomponentsjs'

asset 'polymer', github: 'Polymer/polymer' 
asset 'polymer-core-elements', github: 'Polymer/core-elements' 
asset 'polymer-paper-elements', github: 'Polymer/paper-elements'
asset 'platform'

# Voice Synthesis and Recognition
asset 'voice-elements'

找出所需的内容，然后删除其余的内容.

Figure out the ones you need and delete the rest.

rake bower:install
要下载组件，但请注意，文件将保存在供应商/资产/bower_components中，而不是emcee期望的供应商/资产/组件中.因此，您将需要进行符号链接.

rake bower:install
To download the components but take note that the files will be saved in vendor/assets/bower_components and not vendor/assets/components expected by emcee. So you will need to make symbolic link.

设置符号链接

• 首先删除组件，即rm -rf vendor/assets/components
• 然后设置符号链接，即ln -s vendor/assets/bower_components vendor/assets/components

• first remove components i.e. rm -rf vendor/assets/components
• then set up the symlink i.e. ln -s vendor/assets/bower_components vendor/assets/components

现在设置您的资产

# app/assets/components/application.html
*= require polymer/polymer

# app/assets/javascripts/application.js
//= require angular/angular
//= require angular-route/angular-route
//= require angular-resource/angular-resource
//= require webcomponentsjs/webcomponents
//= require platform/platform

(请注意，我仅包括用于测试的所有内容.如前所述，请删除不需要的内容.)

(Please note that I only included all I am using for testing. As stated before, remove those you don't need).

只要打扫一下房子，您就可以开始尝试.在耙资产路径中包括Bower组件.

Just some house cleaning you jump off to start trying things out. Include Bower components in rake assets path.

# config/application.rb
config.assets.paths << Rails.root.join("vendor","assets","bower_components")

这就是设置的过程.跳上它并开始使用它.

And that is about it for setup. Jump on it and start using it.

在布局文件中包含html导入标签

Include html import tag in your layout file

= html_import_tag "application", "data-turbolinks-track" => true

然后在您的视图中调用示例聚合物

And call a sample polymer in your view

# sample.html.haml
================     
%paper-tabs{:selected => "0", :scrollable => ""}
  %paper-tab Skills
  %paper-tab Experiences
  %paper-tab Education

参考 http://angular-rails.com/bootstrap.html http://www.akitaonrails.com/2014/06/29/usando -polymer-com-rails#.VHcoW2SsV81

这篇关于带有导轨的Google Polymer 4的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！