-1

EDIT: Okay, it took me some time: In 2022 we just use for example "sass/sass/sass" installed with brew, in my case and watch for changes in our project directory with "sass --watch ."

I had a lot of trouble setting up the sass compiler for atom via terminal as a beginner in the field. I had problems because of the M1 chip in my Macbook and missing permissions from node. After installing node and node-sass i got the following error, when saving an scss file in Atom: "command failed: /bin/sh: node-sass: command not found"

I didn't find a direct answer at stackoverflow either, so i create this post to possibly help others, so they don't have to read 8 different descriptions themselves.

com.on.ist
  • 60
  • 1
  • 8

1 Answers1

0

I have now read many tutorials on this and would like to show you the way the installation worked for me. I have now used homebrew because it does not cause problems with missing rights on mac.

This is how i proceeded:

  1. uninstall node and node-sass
  1. install xcode: https://itunes.apple.com/us/app/xcode/id497799835?mt=12
  1. install homebrew

run this command in terminal

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

(takes a time, more information: https://brew.sh/)

3.1 If you have Mac with M1 chip run

touch ~/.zshrc

open -a textedit ~/.zshrc

write the following line in the file and save:

eval $(/opt/homebrew/bin/brew shellenv)

(more info: https://apple.stackexchange.com/a/413207 and https://github.com/Homebrew/discussions/discussions/938#discussioncomment-407419)

  1. install node
brew install node

4.1 If you have Mac with M1 chip and terminal says: "zsh: command not found: brew" And if also in the process this mesaage appear: "Warning: /opt/homebrew/bin is not in your PATH."

Do this:

export PATH=/opt/homebrew/bin:$PATH

(more information: https://stackoverflow.com/a/65493486/9739794, https://github.com/Homebrew/brew/issues/10152)

Repeat step 4

  1. install node-sass
brew install node-sass
  1. Write homebrew in $PATH
sudo nano /etc/paths

Add one line with this content and save:

/opt/homebrew/bin

(more information: https://techpp.com/2021/09/08/set-path-variable-in-macos-guide/#Setting_the_PATH_Variable_Temporarily, https://www.architectryan.com/2012/10/02/add-to-the-path-on-mac-os-x-mountain-lion/#.Uydjga1dXDg)

  1. Off course, install "sass-autocompile" package for atom: https://atom.io/packages/sass-autocompile#examples

Now you should activate compiling in Atom under "Packages" > "Atom Sass" > "compile file". Then every time you save a Sass file, the CSS file should be created automatically.

com.on.ist
  • 60
  • 1
  • 8