Rails: application.css not in asset pipeline
Asked Answered
A

6

20

I know this is a old question but no answer is fixing my problem.

I'm new to Ruby on Rails and just created project with a PostgreSQL database just to be able to upload the project to Heroku.

When i start the rails server im getting the error "application.css is not present in the asset pipeline."

I'm using bootstrap 4 gem and this requires that you rename the applications.css to application.scss.

I dont know what is wrong.

I really tried every answer that is on stackoverflow without any success :(

Please help me, what am i doing wrong?

This is the error im getting: enter image description here

Amphiarthrosis answered 15/6, 2019 at 21:5 Comment(0)
I
12

origin answer

in my case, I forgot to install yarn command in my server.

so, please install yarn before running rails server. otherwise assets:precompile will do nothing and give no warning.

update

also, make sure all of these things:

  1. file exists: app/assets/stylesheets/application.css
  2. its content looks like:
/* ...
 *= require_self
 *= require_tree .
 */
  1. also check file app/assets/config/manifest.js,
//= link application.css
Israel answered 26/9, 2020 at 9:53 Comment(0)
B
25

Ok, first thing.

Do you have config.serve_static_files = true set in your production.rb file under config/environment folder.

Since we run behind NGINX, in our case it looks like config.public_file_server.enabled = ENV['RAILS_SERVE_STATIC_FILES'].present?

Second thing. Did you do rails assets:precompile before the uploading it to the server?

And the third thing is. Have you tried calling your file application.css.scss, and redoing the rails assets:precompile?

Last, and not least thing. How does your application.scss file look like?

Did you remove all those *= and used @import instead for Bootstrap

It is nicely described in the documentation:

Import Bootstrap styles in app/assets/stylesheets/application.scss:

// Custom bootstrap variables must be set or imported before bootstrap. @import "bootstrap";

And then it says:

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 app/assets/stylesheets/application.scss Then, remove all the *= require and *= require_tree statements from the Sass file. Instead, use @import to import Sass files.

Do not use *= require in Sass or your other stylesheets will not be able to access the Bootstrap mixins and variables.

Read more here

Bouncer answered 19/6, 2019 at 12:26 Comment(3)
Thank you! this fixed my problem!Amphiarthrosis
rails assets:precompile is what did it for me.Galton
This is possibly the best SO answer I've found in SO in 10 years. I've been following these instructions 7-8 times already in the past month. Wow.Graeae
I
12

origin answer

in my case, I forgot to install yarn command in my server.

so, please install yarn before running rails server. otherwise assets:precompile will do nothing and give no warning.

update

also, make sure all of these things:

  1. file exists: app/assets/stylesheets/application.css
  2. its content looks like:
/* ...
 *= require_self
 *= require_tree .
 */
  1. also check file app/assets/config/manifest.js,
//= link application.css
Israel answered 26/9, 2020 at 9:53 Comment(0)
M
7

To give more clarity to mutantkeyboard's answer

I had this issue when deploying a Rails application as a docker image that would run in a docker container without a web server like Nginx.

Here's how I got it fixed:

This issue is primarily caused in production when you do not want to serve your static files from the /public folder using a web server like Nginx or Apache.

To serve files your static files from the /public folder without using a web server like Nginx or Apache, do the following:

Ensure you precompile your assets using:

bundle exec rails assets:precompile

OR

rails assets:precompile

This will compile your assets into the /public folder

Next, in your config/environments/production.rb file, add the following:

Instead of this:

config.public_file_server.enabled = ENV['RAILS_SERVE_STATIC_FILES'].present?

Use this:

config.public_file_server.enabled = true

This allows rails to serve the static files instead of a web server

Note: For improved performance it's best to serve the static files using a Web server like Apache or Nginx.

Mcqueen answered 11/8, 2021 at 18:52 Comment(4)
Where someone (such as @Dharman) removes "hope this helps" from your posts, please leave this be. It is regarded as a good edit here.Frameup
It is best to leave this phrasing from your posts. The main reason is that technical writing is an expectation here, and there is something rather wheedling and needy about it - it sort of says "please upvote me". However, there is no need to make such a request - posts that are good will be upvoted quite organically.Frameup
Just a quick note on stats - I see you have 344 instances of "That's all" at the end of your posts, and 323 "Hope that helps". These sign-offs don't add any value, and represent quite a lot of repair work.Frameup
I apologise for the slew of notes, but your account is ringing quite a lot of alarm bells. You seem to be in the habit of reflexively rolling back edits made to your material. I have rolled some of these back and plan to roll some more back also. Please flag to a moderator if you disagree - the edits that have been made appear to be good ones.Frameup
B
2

Rails 7.0.4 ruby 3.1.2 I solved issue with yarn build when missing application.js but in case missing application.css just did yarn build:css

Bessiebessy answered 23/12, 2022 at 12:53 Comment(0)
L
1

Just reinstall yarn et precompile our assets:

yarn's parkages don't push on github... to fix this, reinstall yarn:

yarn

and precompile assets:

bundle exec rails assets:precompile
Lysis answered 14/8, 2022 at 15:46 Comment(0)
K
0

I had this problem with a rails 7 app that uses esbuild, which was odd because other apps on the same laptop that also use esbuild worked fine.

In any case, the solution was to cd into the app's root directory and install esbuild there by running:

npm install --save-exact esbuild 

Then all of a sudden running bin/dev started the app and it worked as expected and without error.

Komi answered 19/6, 2023 at 12:35 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.