'scss rendering error [Internal Error: File to read not found or unreadable:]

I want to make a website with scss but when i save the scss file it gives me an error. However, if I saved it a couple times then it will render completely. Its nothing major but it bugs me.

I tried finding an answer in Google but nothing works

This is just a simple scss file because I am just trying to check if there's an error before i begin my project. turns out there is.

@import "fixed";

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  background: #444;
}


{
  "status": 3,
  "message": "File to read not found or unreadable: E:/Coding Stuff/Websites/bs4/scss/main.scss",
  "formatted": "Internal Error: File to read not found or unreadable: E:/Coding Stuff/Websites/bs4/scss/main.scss\n"
}

after saving a few times then:

=> changed: E:\Coding Stuff\Websites\bs4\scss\main.scss
Rendering Complete, saving .css file...
Wrote CSS to E:\Coding Stuff\Websites\bs4\css\main.css

What did i do wrong? please help

csssass


Solution 1:[1]

if you are using a node-sass as the compiler and vscode or sublime text AFAIK, the issue is with atomic save option where node-sass can't have access to transpile the scss file because the editor is still busy with it. Two ways of fixing this include:

  1. Replace render.js file of node-sass

check here there is a drawback of having to do this everytime you install node-sass

  1. Install sass module instead

    $ yarn add -D sass script

    $ sass --watch input.scss output.css

Solution 2:[2]

Follow below steps

  1. npm i sass --save

  2. Add to package.json: "scripts": { "sass": "sass --watch sass/style.scss:css/style.css" }
  3. Add 2 folders (sass & css) and add a file in sass (style.scss)
  4. Type in terminal > npm run sass

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 oyeyipo
Solution 2 1sina1

Related Questions