Rails can't include AngularJS

Question

I'm following this tutorial and although adding it to the Gem file and bundle installing it works fine. The moment I try to include it into application.js, the file, I get the following error while loading it:

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

application.js file looks like so (starting with line 13):

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

Therefore, my question is how can I successfully include AngularJS into my Rails project?

I'm currently using Rails 3.2.2, and Ruby 1.9.3.

Andrey Deineko · Accepted Answer · 2015-04-02 14:12:43Z

6

I had face same problem. I resolved it by following way.

1) In my case, //= require_tree . was missing in application.js file.. so i have added it.

2) Restarted Apache Server (If webrick, then restart it)

edited Apr 2, 2015 at 14:12

Andrey Deineko

52.5k11 gold badges119 silver badges151 bronze badges

answered Jul 2, 2012 at 11:50

GBD

16k2 gold badges49 silver badges52 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Hengjie Over a year ago

I'm still investigating what happened, however, by the looks of things, once that line is added to application.js for a while, it can be removed. It sounds weird, and I'm still investigating what changed to allow it to work without require_tree.

GBD Over a year ago

require_tree . will result in you having a single file (application.js in this case) holding all your scripts that is there in the folder.

Jakub Arnold · Accepted Answer · 2012-07-03 19:51:28Z

5

After adding a gem you always have to restart the web server.

From looking at the gem's source code, it has the angular javascripts in vendor/assets/javascripts, which means they will be available by just doing //= require angular. If they don't load, it's probably because the server needs to be restarted and you need to bundle install.

As for the require_tree ., I strongly advise against that, because it means you will lose control over the order in which things get loaded.

For example angular itself is packaged with it's own version of jQuery (jQuery-lite), but if there is already jQuery present when it is loaded, it will use the global version.

Which means doing

//= reqiure angular 
//= require jquery

will do something different, than

//= require jquery
//= require angular

There are many other cases when load order can matter, for example if you have Backbone.js and Underscore, you will want to load Underscore before Backbone, etc.

As a general practice I would always recommend just using require, unless you're loading your own code where order doesn't matter, for example //= require_tree ./controllers for your own directory of controllers. In that case I'd say require_tree is perfectly ok.

answered Jul 3, 2012 at 19:51

Jakub Arnold

87.5k94 gold badges236 silver badges334 bronze badges

2 Comments

Hengjie Over a year ago

It's weird because there's nothing in vendor/assets/javascripts other than one hidden file. Is that meant to be normal after having added it to the Gem file, bundle installed, and restarted foreman?

Jakub Arnold Over a year ago

@Hengjie it won't copy in your rails application direclty. The gem itself has a vendor/assets/javascripts directory with the file.

Bharat Bhushan · Accepted Answer · 2014-12-04 11:08:05Z

4

in your gemfile if you are using like this :

group :assets  do
   gem 'angularjs-rails'
end

then remove that group :assets thing, It should be simple without block:

ex:

gem 'angularjs-rails'

It will definitely work

edited Dec 4, 2014 at 11:08

answered Dec 4, 2014 at 9:46

Bharat Bhushan

3051 silver badge15 bronze badges

1 Comment

Bharat Bhushan Over a year ago

In rails 4 version, May be there is some conflict with assets for this gem, need to check

Mr H · Accepted Answer · 2014-05-21 01:15:14Z

2

In case anyone had a same issue and the offered solution wouldn't work. I have added //= require angular in the asset

group :assets do
//= require angular
end

However still I was getting the same error. After a bit of search I found out that for some reason it needs to be added outside of the assets group. All good now. Not sure if this is a best way though however I am not getting this error anymore.

answered May 21, 2014 at 1:15

Mr H

5,3143 gold badges42 silver badges46 bronze badges

Collectives™ on Stack Overflow

Rails can't include AngularJS

4 Answers 4

2 Comments

2 Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

2 Comments

2 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related