Rails momentary SCSS compilation error - ruby-on-rails

(Rails 5.1 on Windows 10) When I modify the SCSS file (app/assets/stylesheets/mystyle.scss), I get this error (Error compiling CSS asset - Permission denied # utime_failed) in Chrome when immediately reloading the page which references it. If I load the page in the browser again, it works fine. I appreciate that the SCSS needs time to run but have not seen this (bad) behaviour before. Any suggestions?
I notice this different error when doing the same in Edge, which then gets replaced with the same error as above on the second attempt and then is fine on attempt #3:

The problem's disappeared. I think it was due to the SCSS file being included in the require_tree . manifest but the CSS file was also being referenced a few lines later in the HEAD. I noticed this and removed the second (CSS) reference.

Related

Custom SCSS file is not importing

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.

Application.css.scss causing issue with rails 4

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.

Rails 4 not loading css.scss files

I had a Rails 4 app that was loading the css.scss files just fine. Then I did something to break it, I don't know what, and reverting to the last git check-in isn't fixing the problem.
My structure is exactly as rails new [project name] left it, and I've never had to look at how the assets get loaded. Reading up on the asset pipeline just left me more confused.
I'm actually putting all of my styling in app\assets\stylesheets\application.css.scss, which begins with
*= require_self
*= require_tree .
as I believe it should, but (judging from the Chrome developer tools view) the application isn't even getting as far as loading that. So where does a Rails 4 application get told to load app\assets\stylesheets\application.css.scss?
(Yes, I see others have problems with loading the stylesheets, but the advice always seems to be to put the stylesheets where I already have them or to include those lines in the application stylesheet that I already have, so it looks as if my problem is something else).

Bootstrap-sass gem not loading

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?

Less compiler doesn't update css file after LESS code is updated

This is way beyond my knowledge..
I was migrating my rails 3 application from Bootstrap 2 to Bootstrap 3. I downloaded Bootstrap 3 and FontAwesome, put them into my assets folder. Then I tried to modify the font path. I change #FontAwesomePath in font-awesome/variables.less several times, however it still don't points to the correct path. (I put font files in ./app/assets/fonts/font-awesome/)
#FontAwesomePath: "fonts/font-awesome"
It's ok, cuz I saw the line below this one is a cdn path to font files:
//#FontAwesomePath: "//netdna.bootstrapcdn.com/font-awesome/3.2.1/font"; // for referencing Bootstrap CDN font files directly
I uncomment this line, everything seems fine. The compiled css file load the font from cdn and all icons are displaying.
Then I delete this line, try to point #FontAwesomePath back to local server again. STRANGE thing happened! No matter what I did, the compiled css file points it to the CDN path! I tried to clear browser cache, reboot rails server (I was using development mode of rails server), even to load the website from other computers, nothing changes. It insisting point #FontAwesomePath to the CDN path even no where in the whole application code exists the url! I can only image there is some kind of variable cache in less compiler. Can anybody tell me what's happened inside this? It's driven me crazy.
edit: I'm using less gem (v 2.3.2), which includes lesscss v 1.3.3.
I had issues with CSS updates, these where only solved by going to tmp > cache and deleting the assets folder then restarting the server. The CSS was then updated.
Hope this helps.
Steph

Resources