Problem with SASS on netlify

[salademaquinas]

Hey @victoriadrake,

I was having a great time with sam but I got stuck on editting css/sass.

My changes do make effect locally, unfortunately as I deploy to netlify from gitHub I keep getting the original/default layout.

Would you share some light on this?

Thank you for all your patience and hard work.

[victoriadrake]

Hello! Glad you like the theme!

The first thing that comes to mind is that changes made to resources using extended Hugo seems to require committing the resources as well. In effect; make the changes, run hugo, commit the generated resources/ files with the built site.

You will also want to ensure that the version of Hugo specified in your Netlify settings is the one you mean to use, and that the Netlify site is building from the correct branch/folder.

To get more specific I'd have to know more about your set up. How did you add the Sam theme to your site? If the repository is public, I can take a look.

[vjFaLk]

Okay, so I had the same problem, and after a lot of digging I figured it out. I don't know if it's a Hugo bug or a feature?!

Here's what I think is happening -

• The theme uses Hugo Pipes to build SASS files, now the way the pipes are setup in this theme, it also needs npm packages - postcss-cli and autoprefixer.

• The theme has it's own bundled version of sass (this is going to be important in a second)

• If you see the way the css partial is generated, you'll notice that if you're running the site through the hugo server it doesn't actually use the PostCSS pipe (this is also going to be important in a sec)

• If you run hugo to build your site, hugo will try to build using pipes, but if you don't have those two npm packages installed, it uses the existing bundled sass files in the theme folder instead of throwing an error. But if you're running the site through the development server, there is no postcss-cli requirement to generate CSS in that case, so it builds just fine.

• If you install the dependencies and then run hugo your site will generate perfectly and it won't pick up the existing sass files.

• If you delete the resources folder from the theme folder, and try running hugo that's when it'll fail and ask you to install dependencies.

To avoid other people from falling into the same problem, I'd recommend getting rid of the resources folder in the theme, and also mention these dependencies in the readme.

I'm not sure if that's the right fix though, I do believe this is a bug with Hugo.

Love the theme btw <3

Edit - I ended up making an issue on the hugo repo - gohugoio/hugo#6729

[victoriadrake]

Amazing. Thank you @vjFaLk for digging into this! I think you have identified a workable solution, whether or not Hugo considers your issue a bug.