Ran into an interesting problem and wondered if anyone else has as well.
I'm doing a Rails tutorial and part of the setup is installing the bootstrap-sass gem. The tutorial recommends for installing bootstrap, to rename the existing application.css file to application.css.scss, removing all the contents in that file, and then adding #import "bootstrap";.
I downloaded the tutorial's source code and ran it on my local machine and it works just fine.
However, when I implemented this in my code, no css stylings appeared. No errors appeared in the logs, either, though I noticed there was no GET request for the css occurring. I even went into the source code, clicked the css file and it appeared empty, while all the bootstrap javascript files were not empty.
After a while, I decided to implement bootstrap in the way that several other tutorials had done - I put the application.css.scss file back to its normal application.css file with all of the default contents that appear there, and then created a new file that I called styles.css.scss and put in the #import "bootstrap"; there and it loads it just fine.
I contacted a mentor of the program teaching the tutorial. He downloaded my source code from my github repo and saw exactly what I saw, though his project was working just fine, and no other students of the program had yet reported an issue doing it the way that the tutorial (and the bootstrap-sass docs) suggested.
Has anyone else ever run into this issue?
Related
I am developing a food recipe app but got stuck and have a problem with javascript and css(Tailwind) assets. Both Javascript and new tailwinf codes not compiling at all. It was fine before but when i was deleting carrierwave gem i accidentally remove public/assets folder because i was going to use active storage for that purpose(image uploading), now even if i do rails assets:precompile, it doesn't change anything. Old tailwind codes works just fine but newly written tailwind codes that i didn't use before doesn't work even if i run server with ./bin/dev. I don't know which part of my code should i share so i can share GitHub link of my project. Thanks it advance.
I'm working on a rails app and using Sass. So far everything has been done in the application.scss file which has worked great.
I'm having two issues which I think are caused by the same problem.
1) I created a users model which generated a users.scss file. When I started to use it, I noticed that it wasn't actually importing into the final web page. So at the top of the application.scss file I added #import "users". Which leads to issue 2.
2) When running the final page, I get a Syntax error:
Invalid CSS after "// VARIABLES": expected selector or at-rule, was "$hero-font: Lor..."
I'm wondering if I might have missed where the import is happening for the Sass files or am using them incorrectly?
Thanks!
I added back the *= require statements from the application.scss file.
I have a rails engine that's been working great for the past year. I decided it was time to add some automated testing to the application and I'm running into a problem getting the dummy app to run.
I'm using rspec in my engine and I have the dummy app at spec/dummy. My original engine was NOT generated using the rails plugin new command. I created it using bundle gem and built it up over time by adding the required files. To get the automated testing working, I created a new engine using rails plugin new so I could see how the dummy rails app is created. I copied all the relevant files into my new engine and almost everything works great. I'm able to execute some simple rspec examples against the dummy app, however, these are very basic examples which boot the dummy app, but don't actually hit any controller actions.
I wanted to see if I could run the dummy application so I could start adding more interesting rspec tests using capybara. My engine adds some controllers and views to its host rails app, so I should be able to go to the relevant paths in the browser and have the views load. When I change to the spec/dummy folder and start the rails server, the app boots fine. However, as soon as I try and bring up a page, I get the following error:
File to import not found or unreadable: font-awesome
Again, the engine has no problem running in a regular Rails application. It's something about this dummy app that isn't right. The spec/dummy/config/application.rb file has:
require "my_engine"
If I understand correctly, this should require the lib/my_engine.rb file and inside that file I have:
require "font-awesome-rails"
So at this point, my_engine should be loaded along with all of it's component gems like font-awesome-rails. I see references to font-awesome in the $LOAD_PATH so this appears to be working.
The error is occurring because the engine has an app/assets/stylesheets/my_engine.scss file which has:
#import "font-awesome";
#import "another-file-from-another-engine-I-wrote";
This file gets loaded because the app/assets/stylesheets/application.scss file of the dummy has:
#import "my_engine";
So, the dummy app imports the scss file in the engine, which in turn pulls in the font-awesome stylesheets. This technique works great for regular Rails applications, but it seems to be failing for the dummy app and I'm stumped as to why.
This isn't a font-awesome issue. If I comment out the #import "font-awesome" inside my_engine.scss, I get the exact same error on the next component asset:
File to import not found or unreadable: another-file-from-another-engine-I-wrote
I've triple checked the files in my_engine to make sure they would match what was generated if I had originally created the gem using rails plugin new. It seems like the dummy app isn't able to load the assets from the sub component gems. What am I missing?
I figured it out. Nothing was telling the engine to load the sass-rails gem. Adding this to my gemspec fixed everything:
spec.add_development_dependency "sass-rails", "~> 5.0.4"
'sass-railsis added to theGemfile` for new Rails applications which is why everything worked fine in regular rails app.
So i've been learning ruby on rails and i decided to add some style to my new posts page on a myrubyblog app. Everything was working. After a few days i decided to import scss from the posts.scss file into the application.css.scss and well i get this error
RuntimeError in Home#index
Showing c:/Sites/myrubyblog/app/views/layouts/application.html.erb where line #5 raised:
Current ExecJS runtime does't support ES5. Please install node.js.
(in c:/Sites/myrubyblog/app/assets/stylesheets/application.css.scss)
Extracted source (around line #0):
After removing my application.css.scss file, the pages were working. Upon removing the actual scss code and leaving the application.css.scss the page began to give problems again. I decided to leave the application.css.scss file deleted. This for some reason allows for the styles i set in it to show up even though the stylesheet itself has been deleted.
Installing Node.js seemed to have worked. I just had to reboot.... twice...
Thx guys i guess.
Going nuts here. I'm developing a rails app, and I'm using the twitter-bootstrap-rails gem in order to include the Twitter Bootstrap styles in my app. This gem generates a file called 'bootstrap_and_overrides.css.less' in app/assets/stylesheets, which I have been using to modify some of the bootstrap variables and include my own CSS overrides.
Everything has been working fine until today. For some reason, the changes I am making to this file today are getting saved to the file, but Rails is still serving the old version of the file! I've searched and found no precompiled versions of the file anywhere (nothing in public/assets)...only the one in assets/stylesheets which I have been modifying. Everything looks fine as far as the directories within the app go, but then when I start the rails server, load the page, and use the element inspector to look at the stylesheets, it's using an old version of 'bootstrap_and_overrides.css.less' with rules that I have deleted. I've turned of the cache in my browser, and tried it in 4 different browsers too, so I'm pretty sure this isn't a result of browser caching.
The rails asset pipeline just seems to serving a version of the file that doesn't exist! Does anybody have any ideas why this might be happening?
Fixed it.
The asset pipeline was storing a cached version in tmp/cache.
I ran rake tmp:clear, which deleted all the files in there, and then rails served the version of *bootstrap_and_overrides.css.less* that I wanted.
Why the cached version suddenly stopped getting updated is beyond me. Arrghhhh!