TransWikia.com

Jeykll file to import not found or unreadable: base

Stack Overflow Asked by Kyu96 on December 22, 2021

Ok, so, I somehow managed to break my jekyll website and I don’t understand why. When I try to serve the site with jekyll I am prompted the following error:

/usr/lib/ruby/gems/2.7.0/gems/jekyll-sass-converter-2.1.0/lib/jekyll/converters/scss.rb:190:in `rescue in convert': Error: File to import not found or unreadable: base. (Jekyll::Converters::Scss::SyntaxError)
        on line 24:1 of main.scss
>> @import

   ^

My directory structure looks like so:

.
├── README.md
├── _site
│   ├── README.md
│   └── src
│       ├── assets
│       │   ├── posts
│       │   │   └── 202-07-23-about
│       │   │       └── avatar.png
│       │   └── screenshot.png
│       ├── general
│       │   └── 2020
│       │       └── 07
│       │           └── 23
│       │               └── about.html
│       └── index.html
└── src
    ├── assets
    │   ├── images
    │   ├── posts
    │   │   └── 202-07-23-about
    │   │       └── avatar.png
    │   └── screenshot.png
    ├── _config.yml
    ├── css
    │   └── main.scss
    ├── _includes
    │   ├── footer.html
    │   └── head.html
    ├── index.html
    ├── _layouts
    │   ├── default.html
    │   ├── page.html
    │   └── post.html
    ├── _posts
    │   └── 2020-07-23-about.md
    ├── _sass
    │   ├── _base.scss
    │   └── _syntax-highlighting.scss
    └── _templates
        ├── draft
        ├── page
        └── post

I assume it has trouble finding the _base.scss file? How can I tell it where it needs to look? It is pointing out the error is in line 24, but that doesn’t really makes much sense. My main.scss looks like so:

---
# Only the main Sass file needs front matter (the dashes are enough)
---
@charset "utf-8";

// Our variables
$base-font-family: 'PT Serif', Georgia, Times, 'Times New Roman', serif;
$base-font-size:   12pt;
$small-font-size:  $base-font-size * 0.875;
$base-line-height: 1.5;

$mono-font-family: 'Source Code Pro', Menlo, Monaco, Inconsolata;

$text-color:       hsl(0, 0%, 25%);

$alt-color:        hsl(0, 70%, 46%);
$alt-color-darker: darken($alt-color, 6%);

$article-bg-color: hsl(35, 36%, 95%);
$background-color: darken($article-bg-color, 6%);
$bg-color-darker:  darken($article-bg-color, 15%);
$alt-text-color:   darken($article-bg-color, 60%);

$subdued-border:   rgba($bg-color-darker, 0.5);

// Import partials from `sass_dir` (defaults to `_sass`)
@import
  "base",
  "syntax-highlighting"
;

Can someone point out how I can fix this problem?

One Answer

Your project directory structure looks a little odd, since you use the unconventional organisation within the src folder.

I see 2 simple solutions:

1. Move the contents out of the src folder into the root

That is the expected structure and you don't run into further configuration issues. It will just work because everything is where it is supposed to be.

2. Configure sass in _config.yml

In your _config.yml add the following sections:

sass:
  sass_dir: src/_sass

and the jekyll-sass-converter should be able to find it. Have a look at the Jekyll Assets Docs for further information.

Answered by Jens Krause on December 22, 2021

Add your own answers!

Ask a Question

Get help from others!

© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP