Asset pipeline not loading script from rails-assets gem

Issue

I have added the danial-farid–angular-file-upload library to my rails 4 app via rails assets. The main library loads fine, but sprockets can’t find the shims file it includes for file upload progress. I think this is because the shims file is not in the same directory as the main angular-file-upload.js script. Is that likely to be the issue, or am I looking in the wrong place for the problem?

Details:

According to the home page on github:

<!-- shim is needed to support upload progress/abort for HTML5 and non-HTML5 FormData browsers.-->

In gemfile:

gem 'rails-assets-danialfarid--angular-file-upload'

In application.js:

//= require angular-file-upload-shim
//= require angular
//= require angular-resource
//= require angular-ui-bootstrap-tpls
//= require angular-ui-router
//= require angular-file-upload

As is this generates a Sprockets::FileNotFound error:

couldn't find file 'angular-file-upload-shim'

If I remove the first require above, the asset pipeline loads everything else fine, but it breaks the things that rely on the shims file.

A grep of the gems directory reveals:

rails-assets-danialfarid--angular-file-upload-1.4.0/vendor/assets/javascripts/angular-file-upload
rails-assets-danialfarid--angular-file-upload-1.4.0/vendor/assets/javascripts/angular-file-upload/angular-file-upload-shim.js
rails-assets-danialfarid--angular-file-upload-1.4.0/vendor/assets/javascripts/angular-file-upload/FileAPI.min.js
rails-assets-danialfarid--angular-file-upload-1.4.0/vendor/assets/javascripts/angular-file-upload/angular-file-upload.js
rails-assets-danialfarid--angular-file-upload-1.4.0/vendor/assets/javascripts/angular-file-upload/angular-file-upload-html5-shim.js
rails-assets-danialfarid--angular-file-upload-1.4.0/vendor/assets/javascripts/angular-file-upload.js

I can see that there is an angular-file-upload.js in the gem’s vendor/assets/javascripts directory while the angular-file-upload-shim.js file is in a subdirectory of that folder. Is that sufficient to break the asset pipeline?

Solution

You probably need to ad the sub directory. i.e.

//= require angular-file-upload/angular-file-upload-shim

Answered By – Marc Rohloff

Answer Checked By – Willingham (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.