Error in Step by Step Tutorial

Help
#1

Hi, I have been trying to do the step by step tutorial here Setup | Jekyll • Simple, blog-aware, static sites but ran into some compilation issue with SCSS:

jekyll/assets/css/main.scss 3:15 @import
jekyll/assets/css/styles.scss 2:4 root stylesheet
Conversion error: Jekyll::Converters::Scss encountered an error while converting ‘assets/css/styles.scss’:
expected “{”.
Error: expected “{”.
Error: Run jekyll build --trace for more information.

I made sure that I followed the steps verbatim but cannot get rid of the error and blocked. Please help.

#2

what is in this file? can you post the full file?

#3 
---
---
@import 
   "main";

Copied from the tutorial.

#4

i formatted it for you - is main on the 2nd line like that?

It may be complaining about the file it is importing - what is in the main file?

when you paste code put three back tics ``` above and below so it formats properly

1 Like
#5

I’m not at my computer at the moment, but I saw there is a new version of Jekyll released a few days ago. It refers to an issue with main.scss.

I have no idea if this is the issue, but for the sake of trying, rename the file base.scss to main.scss and then change your import to main as well.

#6

@BillRaymond Any idea where to make this change? The tutorial code doesn’t have base.scss. Should try rolling back to a stable version and retry?

#7

Sorry I meant rename main to base :slight_smile:

#8 
1 │ @import "base";
  │         ^^^^^^
  ╵
  - 1:9  root stylesheet 
  Conversion error: Jekyll::Converters::Scss encountered an error while converting 'assets/css/base.scss':
                    Can't find stylesheet to import.
             Error: Can't find stylesheet to import.
             Error: Run jekyll build --trace for more information.

If there’s an older version that works please point me to that.

#9

Hello @thomastk,
I looked into the step-by-step tutorial and successfully completed all steps without any error. Also, I do not see any mentions of @import with the name of the partial file on the next line.
Even when I force my browser to render the viewport at 180pixels max-width, the import directive remains on a single line.

Regardless, I suggest you to delete the folder and start the tutorial again from scratch.

1 Like
#10

For what it’s worth I found this thread because I started getting the same error for an already existing Jekyll site that’s been building successfully for months after running bundle update then bundle exec jekyll serve --future --host 0.0.0.0.

Conversion error: Jekyll::Converters::Scss encountered an error while converting 'assets/css/main.scss':
                    expected "{".
                    ------------------------------------------------
      Jekyll 4.3.2   Please append `--trace` to the `serve` command
                     for any additional information or backtrace.
                    ------------------------------------------------
/usr/local/lib/ruby/gems/3.2.0/gems/jekyll-sass-converter-3.0.0/lib/jekyll/converters/scss.rb:175:in `rescue in convert': expected "{". (Jekyll::Converters::Scss::SyntaxError)

        raise SyntaxError, e.message
              ^^^^^^^^^^^^^^^^^^^^^^

And contents of the assets/css/main.scss are:

---
---

@import "main";

The error goes away if I rename assets/css/main.scss to base.scss and change the import to @import "base"; but I don’t know how anyone else would be able to guess that.