在应用程序中包含 Javascript 文件的标准方法?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/26720907/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 06:22:45  来源:igfitidea点击:

Standard way to include Javascript files in app?

javascriptruby-on-rails-4asset-pipeline

提问by user3277633

Say that I have pulled a fancy.js file from somewhere online, what are the steps that I should take to include it in my Rails 4 application?

假设我从网上某个地方提取了一个 Fantasy.js 文件,我应该采取哪些步骤将它包含在我的 Rails 4 应用程序中?

Right now I have the following

现在我有以下内容

  1. Move fancy.js to assets/javascripts folder
  2. add //= require fancy to application.js asset pipeline
  3. ???
  1. 将fancy.js 移动到assets/javascripts 文件夹
  2. 添加 //= 需要对 application.js 资产管道的要求
  3. ???

Are there more steps after 1 and 2, or am I doing this all wrong to begin with?

在 1 和 2 之后还有更多的步骤,还是我一开始就做错了?

回答by Cyzanfar

Looks like you are on the right path. Take a look inside app/assets/javascripts/application.js

看起来你走在正确的道路上。看看里面app/assets/javascripts/application.js

When you created a new app (i.e., rails new app_name), it should have added

当您创建一个新应用程序(即rails new app_name)时,它应该已添加

//= require_tree .

Simply add references to additional javascript files you wish to include.

只需添加对您希望包含的其他 javascript 文件的引用。

EXAMPLE

例子

//= require jquery
//= require jquery-ui
//= require jquery_ujs
//= require fancy
//= require_tree .

You can find more info on Adding Javascript File to Rails

您可以找到有关将 Javascript 文件添加到 Rails 的更多信息

回答by max

A better alternative when using popular third-party assets is to look on Rubygemsfor a gemified version of the asset. In this case fancybox2-rails.

使用流行的第三方资产时,更好的选择是在Rubygems上查找资产的 gemified 版本。在这种情况下,fancybox2-rails

gem 'fancybox2-rails', '~> 0.2.8'

Adding the gem to your application.jswith sprockets:

application.js用链轮将宝石添加到您的:

//= require jquery
//= require fancybox

Or in a script tag:

或者在脚本标签中:

<%= javascript_include_tag "fancybox" %>

And the css:

和CSS:

/*
 *= require_self
 *= require fancybox
 *= require_tree .
 */

The advantage of using Gemified packages is that its easier to maintain and you avoid polluting your codebase with 3rd party code. The drawback is that the gem may be several versions older than the actual software it encapsulates.

使用 Gemified 包的优势在于它更易于维护,并且您可以避免使用 3rd 方代码污染您的代码库。缺点是 gem 可能比它封装的实际软件旧几个版本。

If you need to add vendor files you should probably be adding them to lib/assetsand not app/assets, since it makes a clear separation between the code which actually drives your unique app and dependencies.

如果您需要添加供应商文件,您可能应该将它们添加到lib/assets而不是app/assets,因为它明确区分了实际驱动您的独特应用程序和依赖项的代码。

Another thing to remember is that assets are most often compiled at deploy time in your production environment (this is especially true on Heroku) and not per request (which would be very slow). So you cannot use conditions in your sprockets directives.

另一件要记住的事情是,资产最常在生产环境中的部署时编译(这在 Heroku 上尤其如此)而不是每个请求(这会很慢)。因此,您不能在 sprockets 指令中使用条件。