简体   繁体   English

Ruby on Rails:资产管道中的JavaScript

[英]Ruby on rails: javascript in asset pipeline

I'm a complete noob and I'm trying to understand how to use javascript with the asset pipeline in Rails. 我是一个完整的菜鸟,我想了解如何在Rails的资产管道中使用javascript。 For example, where do I put a simple $(document).ready to execute in a specific view. 例如,在哪里放置简单的$(document).ready在特定视图中执行。 I have done that puting the code in the view itself, but I think thats not the best way to do it. 我已经完成了将代码放入视图本身的工作,但是我认为那不是最好的方法。 Complementary reads would be appreciated too, thanks. 补充阅读也将不胜感激,谢谢。

create a new file called whatever_you_want.js I usually split these according to views or models. 创建一个名为whatever_you_want.js的新文件。我通常根据视图或模型将它们拆分。 It doesn't really matter in the end since asset pipeline mangles it all to one big file. 最终这并不重要,因为资产管道会将其全部处理到一个大文件中。 Splitting in to files is accoding to your preference and likings. 分成文件就是根据您的喜好和喜好。

So, in whatever.js you can write whatever JS code you want, with $(document).ready , without.. asset pipeline doesn't really care.. If the code you writes needs $(document).ready , use it. 因此,在whatever.js您可以使用$(document).ready编写所需的任何JS代码,而无需..资产管道并不十分在意。.如果编写的代码需要$(document).ready ,请使用它。 If not, don't... 如果没有,请不要...

Once you finished with your JS, Rails will, by default, take all your js file which you told it in application.js manifest file and puts them in one file, by the order you wrote 完成使用JS后,默认情况下,Rails将把您在application.js清单文件中告诉您的所有js文件,并按照您编写的顺序放入一个文件中。

so it will look like 所以看起来像

//= require jquery
//= require jquery_ujs
//= require twitter/bootstrap
//= require_tree .

so it will load jquery first, then jquery ujs, then bootstrap and then tree which is the current directory where application.js is at 因此它将首先加载jquery,然后加载jquery ujs,然后引导,然后再加载tree,这是application.js所在的当前目录

Similarly you could only do 同样,你只能做

//= require whatever.js

On development, by default, you won't see one big file, but all of your files, since its much easier to debug this way. 在开发中,默认情况下,您不会看到一个大文件,但是会看到所有文件,因为这样更容易调试。

Once you deploy to production, depending on what you need, you may precompile all your assets via asset pipeline with rake assets:precompile or you may have a script which will precompile automagically on deploy like asset_sync gem 部署到生产环境后,根据需要,可以使用rake assets:precompile通过资产管道对所有资产进行rake assets:precompile或者您可以拥有一个可以在部署时自动进行预编译的脚本,例如asset_sync gem

Basically, you should put js code in js files and html code in view files since sprockets (the gem that compresses the js and stuff) doesn't handle JS that isn't on assets files/ files to be precompiled 基本上,您应该将js代码放在js文件中,并将html代码放在视图文件中,因为链轮(压​​缩js和内容的gem)无法处理不在资产文件/要预编译的文件上的JS

Some complementary reads for you pleasure 一些补充读物让您感到高兴

http://guides.rubyonrails.org/asset_pipeline.html http://guides.rubyonrails.org/asset_pipeline.html

http://railscasts.com/episodes/279-understanding-the-asset-pipeline http://railscasts.com/episodes/279-understanding-the-asset-pipeline

http://blog.55minutes.com/2012/02/untangling-the-rails-asset-pipeline-part-3-configuration/ http://blog.55minutes.com/2012/02/untangling-the-rails-asset-pipeline-part-3-configuration/

Hope that helps you in someway 希望对您有所帮助

After reading your question a few more times, I realize that what you are asking is "where to put js code that is relevant to a specific view" 多读几次您的问题后,我意识到您要问的是“将与特定视图相关的js代码放在哪里”

Well, now what you are familiar with the asset pipeline, you can now understand how to work with it: 好了,现在您熟悉资产管道,现在可以了解如何使用它:

in your whatever.js file you write whatever you want to write.. Let's presume that you don't have //=require_tree . 在您的whatever.js文件中,您将编写任何内容。.假设您没有//=require_tree . in application.js , so it doesn't include all js files, and you must have whatever.js in whatever.html.erb application.js ,因此它不包含所有js文件,因此您必须在whatever.js中包含whatever.html.erb

in whatever.html.erb you can write whatever.html.erb您可以编写

<% content_for :head do %>
  <%= javascript_include_tag "whatever.js" %>
<% end %>

Then, in your layout file (a file which has <%= yield %> somewhere inside, go to the head of the html and write 然后,在您的布局文件(一个内部有<%= yield%>的文件中,转到html的开头并写

<%= yield :head %>

The name head is basically what you want. 名字头基本上就是您想要的。

This tells Rails something like "Hey man, this whatever.js file is for you.. just put it in the :head ok?" 这会告诉Rails,诸如"Hey man, this whatever.js file is for you.. just put it in the :head ok?" And Rails is like "You got it mister!" Rails就像"You got it mister!"

This way you can include whatever js files you want in whatever views you want. 这样,您可以在所需的任何视图中包含所需的任何js文件。

But since you said you are a complete noob, I would recommend to keep it simple, and include all js file in the first go, just use unique class and ID for your html elements and you should be fine. 但是由于您说过您是一个完整的菜鸟,所以我建议保持简洁,并在所有步骤中包括所有js文件,只需对HTML元素使用唯一的类和ID,就可以了。 Most probably, some people may not agree with this. 很有可能,有些人可能不同意这一点。 But since you said you are a complete noob, it doesn't really matter what I say or they say. 但是,由于您说的是完全菜鸟,所以我所说的或他们所说的并不重要。 Whatever is easier for you to understand is. 您更容易理解的是。 So Experiment with it 所以尝试一下

All the JavaScript should be in app/assets/javascript 所有JavaScript都应位于app / assets / javascript中

Also you can make a separate js file for particular view or you can write your js code in application.js file 您也可以为特定视图制作单独的js文件,也可以在application.js文件中编写js代码

put this code in layout <%= javascript_include_tag "application" %> 将此代码放入布局<%= javascript_include_tag“应用”%>

And finally run rake assets:precompile 最后运行rake资产:预编译

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM