Rebuilding a Theme (Simple Please!)

[WildToddMan]

Greetings!

Let me start by saying that I am very new to all of this! So please go easy on me with your responses!

I am hosting my thirty bees site on a cloud server with A2Hosting. How do I rebuild a theme after I make changes to the scss files?

Everything that I find about it people are talking about "npm". Do I have to try and configure between my computer and the server?

Does tb not offer a solution to rebuild the theme right in the back-office?

I keep making changes to the scss files, but nothing changes. Can someone please help me out a little bit with this?

Thank you so much!

Todd S. - https://boofola.com

[cienislaw]

let me copy & paste it for you:

https://nodejs.org/en/

Download and install node.js + npm, LTS version will do.

With npm up and running you can finally compile SASS to CSS. To do that, make sure you first set up build environment. Steps to do that you can find below. Be aware, that you have to do this on your local machine and use Niara theme from GitHub repo, not release from your store.

https://github.com/thirtybees/niara

Building

This theme works as-is on thirty bees, all built files are committed to the repository.

CSS files shouldn't get edited directly, but their Sass counterpart in sass/ instead. After doing so, CSS gets compiled from that. For contributions, please create commits including both, source file changes together with their build results.

Setting up the build environment

npm install

Building CSS from Sass

npm run compile-css

Linting JavaScript

npm run lint-js

[WildToddMan]

cienislaw Thank you for your response!

The problems that I was having actually appear to be my hosting. If I was on a cloud style hosting plan, this would have been MUCH simpler than even the instructions laid out by thirty bees.

I had to perform a node.js install using SSH and a command line. This was relatively simple to do! Once that was done, with a slight modification of the instructions by you. I now have it up and running perfectly!

I now also have the ability to simply click on an icon and a script runs to do all of it, including incremental backups of the unchanged files incase I screw something up being done by CRON.

At this time I have only made some very small color changes. I have also noticed that my yellow is really close to the thirty bees yellow, but just enough of a difference to notice without changes.

Again, thank you for your help with this!

[datakick]

Just a note:

You should not do the development on a production server. You should do it on your localhost. Once you are satisfied with the result, you should copy generated css, js, and tpl files to your production server.

By running npm install a lot of development tools are installed. You don't want these tools to be present on your production server, as they are potential security risk.