Sass::SyntaxError: File to import not found or unreadable: bootstrap-sprockets

Question

I am suddenly getting this error in development and in production on deployment.

custom.css.scss

@import "bootstrap-sprockets";
@import "bootstrap";

error (in production)

rake aborted!
Sass::SyntaxError: File to import not found or unreadable: bootstrap-sprockets.
Load paths:
/srv/www/myapp/releases/20141001060418/app/assets/images
/srv/www/myapp/releases/20141001060418/app/assets/javascripts
/srv/www/myapp/releases/20141001060418/app/assets/stylesheets
/srv/www/myapp/releases/20141001060418/vendor/assets/javascripts
/srv/www/myapp/releases/20141001060418/vendor/assets/stylesheets

Well if i was you i would check on that bootstrap-sprockets.css.scss file and make sure it's there and ready to roll for Sass to precompile ;-) — jfornoff, Oct 01 '14 at 06:46
Possible Duplicate Question - http://stackoverflow.com/questions/23108679/sasssyntaxerror-file-to-import-not-found-or-unreadable-compass-in-production — Caffeine Coder, Oct 01 '14 at 07:15

score 93 · Answer 1 · edited Apr 17 '18 at 09:56

93

After making changes to Gemfile, do not forget to restart the server with rails s

Restarting the rails server worked like a charm! :D

edited Apr 17 '18 at 09:56

Community

1
1

answered Feb 04 '15 at 13:13

Sergiu

1,181
8
9

1

This fixed it for me. Bootstrap gems require server restart to work. – Lotix Nov 18 '15 at 14:24
I restarted the server as well but I am wondering why it doesn't work? – gogofan Mar 29 '17 at 11:26

score 28 · Answer 2 · answered Oct 24 '14 at 06:17

28

I solved this issue by upgrading bootstrap-sass

gem 'bootstrap-sass', '3.2.0.2'

answered Oct 24 '14 at 06:17

flexus

465
3
9

7

I need a similar change, but I recommend you use the syntax `gem 'bootstrap-sass', '~> 3.2.0'` as it will give you minor version updates rather than locking you into a specific release. – Fitter Man Jan 06 '15 at 14:18

score 13 · Answer 3 · answered Nov 19 '15 at 18:38

13

Please restart you rails server after every changes in Gemfile

rails server

answered Nov 19 '15 at 18:38

Azlan Jamal

2,660
3
22
29

score 9 · Answer 4 · edited Jul 02 '21 at 13:48

9

For the Sass version of Bootstrap 5 in versions of rails before 6 use

gem `bootstrap`

For Sass versions of Bootstrap 3 and 2 Make sure you don't have

gem 'bootstrap'  # Remove this line
gem 'bootstrap-sass'

It should just be

gem 'bootstrap-sass'

edited Jul 02 '21 at 13:48

masukomi

10,313
10
40
49

answered Sep 22 '16 at 05:03

Mark Swardstrom

17,217
6
62
70

1

I had a similar problem, but in my case I had both 'bootstrap-sass' and 'sass-rails' in my Gemfile. Removing 'sass-rails' and leaving just 'bootstrap-sass' like you suggested here worked in that case, too. – bogardpd Jun 04 '17 at 21:22

score 6 · Answer 5 · edited Dec 02 '14 at 16:37

6

I solved it in following steps:

List item
copying the "bootstrap.css" in my "app/assets/stylesheets/ (it was missing)
gem install autoprefixer-rails (also modify Gemfile)
gem install sprockets (also modify Gemfile)
bundle install
RESTART server (not just refreshing page)

edited Dec 02 '14 at 16:37

Fred

3,324
1
19
29

answered Dec 02 '14 at 16:08

Vitalie Suba

147
2
7

6

One plus for `restart server` step. – S.M.Mousavi Mar 24 '15 at 08:42
Restarting the server.. Oh my! – Mark Oct 05 '15 at 15:13

score 3 · Answer 6 · answered Jul 13 '16 at 08:02

This is how I solved the issue.

Go to Bootstrap for Sass Github page and follow the instructions:

Add the following to the Gemfile

gem 'bootstrap-sass', '~> 3.3.6' gem 'sass-rails', '>= 3.2'
Run the command bundle install
Start/restart the server

rails s

Also, make sure the file has .scss extension (or .sass for Sass syntax). If you have just generated a new Rails app, it may come with a .css file instead. If this file exists, it will be served instead of Sass, so rename it. Then, remove all the *= require_self and *= require_tree . statements from the sass file. Instead, use @import to import Sass files.

Thanks for the "restart the server" line, I was stuck 4 hours on it. — Zachary Dahan, Dec 10 '16 at 19:21

score 2 · Answer 7 · answered May 26 '17 at 04:50

I have observed the same behaviour. In my case i have removed the version of the gem 'bootstap-sass' and it worked. There might be compatibility issue with the gem version which was causing the problem.

Gem file

gem 'bootstrap-sass'

After making changes in the gem file perform following commands:

bundle install

If the server is already running then stop it by "CTRL+C" and start the server again

rails s

score 2 · Answer 8 · answered Oct 14 '18 at 17:30

In your Gemfile you need to add the bootstrap-sass gem, and ensure that the sass-rails gem is present - it is added to new Rails applications by default.

gem 'bootstrap-sass', '3.3.7'
gem 'sass-rails', '5.0.6'
gem 'rails', '5.0.0'

bundle install and restart your server to make the files available through the pipeline. Import Bootstrap styles in app/assets/stylesheets/application.scss:

// "bootstrap-sprockets" must be imported before "bootstrap" and "bootstrap/variables"
@import "bootstrap-sprockets";
@import "bootstrap";

bootstrap-sprockets must be imported before bootstrap for the icon fonts to work. Make sure the file has .scss extension (or .sass for Sass syntax). If you have just generated a new Rails app, it may come with a .css file instead. If this file exists, it will be served instead of Sass, so rename it:

$ mv app/assets/stylesheets/application.css TO: app/assets/stylesheets/application.scss

Then, remove all the *= require_self and *= require_tree . statements from the sass file. Instead, use @import to import Sass files. e.g

*= require_tree .
*= require_self

To:

@import require_tree .
@import require_self

Do not use *= require in Sass or your other stylesheets will not be able to access the Bootstrap mixins or variables. Bootstrap JavaScript depends on jQuery. If you're using Rails 5.1+, add the jquery-rails gem to your Gemfile:

gem 'jquery-rails'

$ bundle install

Require Bootstrap Javascripts in

app/assets/javascripts/application.js:

//= require jquery
//= require bootstrap-sprockets

bootstrap-sprockets and bootstrap should not both be included in

application.js

. bootstrap-sprockets provides individual Bootstrap Javascript files (alert.js or dropdown.js, for example), while bootstrap provides a concatenated file containing all Bootstrap Javascripts.

This will fix the error

Copied @github

This is a good answer, but you've pretty much copy pasted the gems readme. — Joseph Cho, Oct 31 '18 at 14:00

score 1 · Answer 9 · answered May 09 '15 at 08:35

This error mostly comes in rails 3.2.x versions. If you are using rails version 3.2 you have to specify a special version in your gem file like below:

gem 'rails', '3.2.0'
gem 'bootstrap-sass', '3.2.0.2'

It will resolve the problem for rails -v '3.2.0'

score 1 · Answer 10 · edited Sep 30 '15 at 11:13

1

put this in gem file

gem 'bootstrap-sass', '~> 3.3.5'
gem 'sass-rails', '>= 3.2'

then run $ bundle install

Restart the server.

edited Sep 30 '15 at 11:13

mik01aj

11,928
15
76
119

answered Aug 10 '15 at 19:49

Nitish Kumar

409
4
4

score 1 · Answer 11 · answered Oct 18 '16 at 20:40

If you get this message when running integration tests, make sure that your asset gems are included in the test group.

For example, change:

group :assets do gem 'sass-rails', '~> 5.0.3' gem 'uglifier', '>= 1.3.0' end

To:

group :assets, :test do gem 'sass-rails', '~> 5.0.3' gem 'uglifier', '>= 1.3.0' end

score 1 · Answer 12 · answered Aug 01 '18 at 12:37

I had the same problem

sass::syntaxerror: file to import not found or unreadable: config/variables.

, I opened a new css file (I called it custom.css) then copied all the css to the file. On application.css I removed the

@import "config/variables" plus all the other @imports

This worked for me, I hope it does work for you too!

score 0 · Answer 13 · answered Jun 23 '16 at 22:31

0

make sure you run the following commands after adding this gem to your Gemfile put this inside your Gemfile

    gem "bootstrap-sprockets", "~>3.3"
    gem "bootstrap"

now stop your server and run the following:

    bundle install
    rails server

to restart your server. Refresh your browser and you should see changes reflect immediately. In production you may have to run this command to precompile your assets:

    bundle exec bin/rake assets:precompile

It worked for me. Hope this was helpful.

answered Jun 23 '16 at 22:31

Paa Yaw

431
6
8

I get `Could not find gem 'bootstrap-sprockets' in any of the gem sources listed in your Gemfile.` when I try that. – Soerendip Feb 11 '18 at 15:21
you should have the gem in your Gemfile – Paa Yaw Nov 09 '19 at 14:59

score 0 · Answer 14 · answered Jan 14 '19 at 07:22

I was also facing the similar error in development environment:

Error Image

I solved this problem by-

In my gemfile, I added them -

gem 'bootstrap', '~> 4.2.1'

gem 'jquery-rails'
In application.js file,add these -

//= require jquery3

//= require popper

//= require bootstrap-sprockets
In the file with .scss extension, simply add -

@import "bootstrap";

After that, just run bundle install

score 0 · Answer 15 · answered Oct 14 '22 at 19:49

0

I encountered that kind of issue. If you can see lower version of bootstrap-sass than 3.4.1 in "Gemfile.lock", please upgrade bootstrap-sass gem version.

answered Oct 14 '22 at 19:49

Yellow Flash

1
1

score 0 · Answer 16 · answered Jan 06 '23 at 09:42

I was able to fix the issue by changing the (.css) to (.scss). Then in there I just have this..

*= require_tree .
*= require_self
@import "bootstrap";

I also have @import "boostrap" in the application.js file. This is just how it worked for me - not a 100% proper fix - it works though.

score -1 · Answer 17 · answered Jul 29 '21 at 03:26

-1

I solved My Issue By Removing

gem 'bootstrap'

answered Jul 29 '21 at 03:26

yash sanghavi

368
3
5

Sass::SyntaxError: File to import not found or unreadable: bootstrap-sprockets

17 Answers17

Linked