Rails 不能包含 AngularJS答案

【问题标题】：Rails can't include AngularJSRails 不能包含 AngularJS
【发布时间】：2012-07-02 08:23:44
【问题描述】：

我正在关注这个tutorial，尽管将它添加到 Gem 文件并捆绑安装它工作正常。当我尝试将它包含到 application.js 文件中时，加载它时出现以下错误：

throw Error("Sprockets::FileNotFound: couldn't find file 'angular'\n  (in /my/path/to/rails/app/assets/javascripts/application.js:13)")

application.js 文件如下所示（从第 13 行开始）：

//= require angular
//= require jquery
//= require jquery_ujs
//= require jquery.ui.autocomplete
//= require bootstrap
//= require pusher.min.js
//= require pusher_setup
//= require_directory .

因此，我的问题是如何成功地将 AngularJS 包含到我的 Rails 项目中？

我目前使用的是 Rails 3.2.2 和 Ruby 1.9.3。

【问题讨论】：

标签： javascript ruby-on-rails ruby-on-rails-3.2 angularjs

【解决方案1】：

我也遇到过同样的问题。我通过以下方式解决了。

1) 就我而言，application.js 文件中缺少//= require_tree .。所以我添加了它。

2) 重新启动 Apache 服务器（如果是 webrick，则重新启动它）

【讨论】：

我仍在调查发生了什么，但是，从外观上看，一旦该行被添加到 application.js 一段时间，它就可以被删除。这听起来很奇怪，我仍在调查什么改变使它可以在没有 require_tree 的情况下工作。
require_tree 。将导致您拥有一个文件（在本例中为 application.js），其中包含文件夹中的所有脚本。

【解决方案2】：

添加 gem 后，您总是需要重新启动 Web 服务器。

通过查看 gem 的源代码，它在 vendor/assets/javascripts 中有 angular javascript，这意味着只需执行 //= require angular 即可使用它们。如果他们没有加载，可能是因为需要重新启动服务器并且您需要捆绑安装。

至于require_tree .，我强烈建议不要这样做，因为这意味着你将失去对加载顺序的控制。

例如 Angular 本身是用它自己的 jQuery 版本（jQuery-lite）打包的，但是如果在加载时已经存在 jQuery，它将使用 global 版本。

这意味着做什么

//= reqiure angular 
//= require jquery

会做一些不同的事情，而不是

//= require jquery
//= require angular

还有很多其他情况下加载顺序很重要，例如，如果您有 Backbone.js 和 Underscore，您会希望在 Backbone 之前加载 Underscore，等等。

作为一般做法，我始终建议只使用require，除非您在顺序无关紧要的情况下加载自己的代码，例如//= require_tree ./controllers 用于您自己的控制器目录。在那种情况下，我会说require_tree 完全没问题。

【讨论】：

这很奇怪，因为在 vendor/assets/javascripts 中除了一个隐藏文件之外什么都没有。将其添加到 Gem 文件、安装包并重新启动工头后，这是否意味着正常？
@Hengjie 它不会直接复制到您的 Rails 应用程序中。 gem 本身有一个带有文件的vendor/assets/javascripts 目录。

【解决方案3】：

如果您像这样使用，请在 gemfile 中：

group :assets  do
   gem 'angularjs-rails'
end

然后删除那个组 :assets 东西，应该很简单，没有阻塞：

例如：

gem 'angularjs-rails'

一定会成功的

【讨论】：

在rails 4版本中，这个gem可能与assets有冲突，需要检查

【解决方案4】：

如果有人遇到同样的问题并且提供的解决方案不起作用。我在资产中添加了//= require angular

group :assets do
//= require angular
end

但是我仍然遇到同样的错误。经过一番搜索，我发现由于某种原因需要将其添加到资产组之外。现在一切都好。不确定这是否是最好的方法，但是我不再收到此错误。

【讨论】：