«Серия 10: Добавление проекта в phpstorm, верстка основного скелета сайта » - Видеокурс магазин на 1С-Битрикс:

Это архивное видео. В принципе вся информация актуальна, но рекомендуется смотреть новую версию:
Разработка проекта на 1С-Битрикс

Настройка PhpStorm под Битрикс. Добавляем Битрикс-проект в IDE PhpStorm. Базовые настройки компилятора sass. Начинаем верстать основную сетку сайта с использованием bootstrap-3.

— Сайт PhpStorm
— Документация по SASS

Установка компилятора SASS в систему

На macOS:
— Открываем штатный терминал
— Выполняем команду sudo gem install sass
— Готово

На Windows:
— Скачиваем и устанавливаем RubyInstaller
— В меню "пуск", находим: "Ruby Command Line" и запускаем
— Выполняем команду gem install sass
— Готово

если возникает ошибка установки sass

На Ubuntu (в 18LTS):
— В терминале, от имени суперпользователя (sudo su) выполняем по очереди.
— apt-get install ruby
— apt-get install sass
— На каждом этапе подтверждаем свои действия
— Готово

Если возникает ошибка установки sass.
Если в процессе установки возникает ошибка подключения по протоколу SSL. Нужно добавить в список источников, адрес к rubygems.org, без SSL.

Ошибка выглядет так:
ERROR: Could not find a valid gem 'sass' (>= 0), here is why:
Unable to download data from https://rubygems.org/ - SSL_connect returned=1 errno=0 state=SSLv2/v3 read server hello A: tlsv1 alert protocol version (https://rubygems.org/specs.4.8.gz)

Выполняем команду: sudo gem sources -a http://rubygems.org
И после подтверждения, добавления источника, снова пробуем установить sass: gem install sass --pre