4

I installed twitter bootstrap by copying the files into my assets directory as per the instructions here: http://www.erikminkel.com/2013/09/01/twitter-bootstrap-3-in-a-rails-4-application/

After following the instructions exactly as presented and executing "rake assets:precompile RAILS_ENV=development", I am able to use bootstrap 3 in my development rails server.

However, when I try to execute "heroku run rake assets:precompile RAILS_ENV=production", I get this error:

Sass::SyntaxError: Invalid CSS after "...ss","sources":[": expected "|", 
was ""less/theme.les..." (in /app/app/assets/stylesheets/application.css) (sass):444

I am not sure what this means. When I open "application.css" in the assets/stylesheets folder, I can't even find a line 444. I do have some scaffold files left over after running "rails g scaffold ..." commands -- could that be causing this problem? And obviously, the deployed heroku app looks like a non-bootstrap app when I view it from the heroku page and throws a "resource not found" error.

In public/assets/application-mydigest.ccs, I found the following line of code that causes the error:

{"version":3,"file":"bootstrap-theme.css","sources":["less/theme.less","less/mixins/vendor-prefixes.less","bootstrap-theme.css","less/mixins/gradients.less","less/mixins/reset-filter.less"],"names":[],"mappings":"AAeA;;;;;;EAME,0CAAA;EC+CA,6FAAA;EACQ,qFAAA;EC5DT;AFiBC;;;;;;;;;;;;EC0CA,0DAAA;EACQ,kDAAA;EC7CT;AFqCC;;EAEE,wBAAA;EEnCH;AFwCD;EG/CI,0EAAA;EACA,qEAAA

However, it seems odd that this would only happen on production. Moreover, the CSS syntax looks fine.

Improve this question
4
  • 1
    You're trying to compile less files with the sass preprocessor. That isn't going to end well. Commented Aug 1, 2014 at 8:31
  • Do you know how I could just disable whatever's causing the problem? I don't really know why it happens only in production mode. Commented Aug 1, 2014 at 8:31
  • start with what assets you have - do you have an application.css, or .css.scss, or .css.less? what's in it? Commented Aug 1, 2014 at 8:34
  • I have a bunch of .scss files, along with application.css and all the .css files associated with bootstrap. The bootstrap installation seems to be a normal install, following the instructions in the article linked in the OP, which is why this is puzzling me. Commented Aug 2, 2014 at 2:04

3 Answers 3

Reset to default
2

This error means the assets compilation failed because of an invalid css syntax into a file you require in application.css.

In bootstrap repository there is a less directory and you can't precompile less files with rails.

If you want to use Rails and Bootstrap on a production environment I think use bootstrap-sass gem is a better option

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

1 Comment

I ended up using this link: rvg.me/2014/01/…
0
+50

Have you tried using rails-assets instead of the referenced method of adding Bootstrap 3? I use it on Heroku with success... and just add my own custom Bootstrap css in my normal assets folders which get loaded after the vanilla Bootstrap 3 and override it. Just add gem 'rails-assets-bootstrap' along with source 'https://rails-assets.org' to your gem file. May help diagnose if nothing else.

Improve this answer

3 Comments

This gave me a "less" compilation error, but thanks for trying, I guess.
Do you have the 'less-rails' gem installed? I think it has some issues with certain versions while using Bootstrap.
Also, do you have any preprocessor gems such as less-rails, sass-rails etc that are in the development or production group of the gemfile but not the other?
0

EIther of the two things you must take care to avoid assets compilation errors when you go live.

- Add all your assets(js/css) in manifest file(application.js/application.css) - OR - use assets.precompile=%w(custom.css custom.js) directive to handle them explicitly

because when u precompile...rails copies everyting(images/fonts) except js/css into public folder to be taken care by the server(apache),hence the setting # Don't fallback to assets pipeline if a precompiled asset is missed config.assets.compile = false in production.rb during assets precompile fallback is disabled by default in production/staging as Rails assumes it will be handled by webserver.Hence we have manifest file to define our assets which gets precompiled during assets:precompile and verified by looking for public/assets/javascripts/application.css/js after compilation which gets created requiring all files mentioned in app/assets/stylesheets/application.css and app/assets/javascripts/application.js after running assets:precompile...so hope u know where you missed.

FOR MORE DETAILS..REFER this

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.