SCSS file error: File to import not found or unreadable: bootstrap

Question

I am trying to set up a site ran on Jekyll I haven't updated in awhile (obviously my developer skills are very rusty in general) with Github Pages. Whenever I try, I get this error: Your site is having problems building: Your SCSS file sass/about.scss has an error on line 1: File to import not found or unreadable: default. Load paths: _sass /hoosegow/.bundle/ruby/2.4.0/gems/minima-2.1.1/_sass. For more information, see https://help.github.com/articles/page-build-failed-invalid-sass-or-scss/.

All my scss pages like about.scss start with this:

---
---

@import "default";

or

---
---

@import "bootstrap";

I have made sure that my config.yml file has this:

sass:
  sass_dir: ./_sass

and I am not sure what to do from here.

Osteophyte

Answer 1

Looks like you're missing a pretty big hint!

File to import not found or unreadable: default

It's looking for a file called default.scss and is unable to do so. Make sure the file exists in the sass_dir you configured and doesn't have any weird read-permissions on it (e.g. can you open the file in another program?).

Transcribe

Thank you! I'm obviously braindead - I just needed to reinstall bootstrap by copying the correct directory and files into my code, as they went missing for some reason. I followed this guide veithen.github.io/2015/03/26/jekyll-bootstrap.html and it worked just fine. Thank you again! – Osteophyte

Answer 2

I was able to fix this error by creating the imported stylesheets (eg. _scss/_default.scss) using cmd.

For example: NUL > _default.scss

Be careful not to overwrite any existing files.

Harrington

Answer 3

Just change the file name. For Example: if your file name is navbar.scss then change it to _navbar.scss and import will remain the same as => @import './styles/navbar'; (assuming the scss file is in your styles folder)

Don't forget to restart the server.

Nahuatl

Answer 4

GitHub ACTIONS CI has thrown this error.

I found that I did not add webpack-dev-server.

I added it as follows and it helped:

    - name: Add webpack-dev-server
      run: |
        yarn add webpack-dev-server
    - name: Build App
      ...

Stainless