scss_compiler

Module automatically compiles scss/less files defined in a libraries.yml into css
SCSS compiler: ScssPhp
LESS compiler: LessPhp

LESS library not included by default because of php 7.2.9 dependency, you need to install it manually via composer "composer require wikimedia/less.php"

Manual installation

SCSS:
1. Download a last release of ScssPhp Compiler
2. Rename it to scssphp and place it to the libraries directory (DRUPAL_ROOT/libraries/)
3. Install the module and all scss files defined in a libraries.yml will be compiled into css

LESS:
1. Download a last release of LessPhp Compiler
2. Rename it to less.php and place it to the libraries directory (DRUPAL_ROOT/libraries/)
3. Install the module and all less files defined in a libraries.yml will be compiled into css

Composer installation

If you manage your site with composer, just install it like other composer
packages, dependencies will be resolved automatically.

Configuration

All module settings are on the performance page.

Option "Check file modified time" tracks a last modified time of files and the
module won't recompile files before they change.

Usage

Flush cache after the module installation to create a compile list cache.

# my_module.libraries.yml
main:
  version: VERSION
  css:
    theme:
      scss/styles.scss: {}
      less/styles.less: {}

By default, compiled files save to public://scss_compiler
Also you can define css_path — path where to save the compiled file,
the path is relative to a module/theme where a libraries.yml is located, for example:

# my_module.libraries.yml
main:
  version: VERSION
  css:
    theme:
      scss/styles.scss: { css_path: '/css/' }

File will be saved to my_module/css/styles.css

Assets path option allows to define where static resources are located, by default
it's a module/theme folder. Full path to an assets folder, supports tokens for
a theme/module.

# my_module.libraries.yml
main:
  version: VERSION
  css:
    theme:
      scss/styles.scss: { assets_path: '@my_module/assets/' }

url(image.jpg) in css will be compiled to
url(modules/custom/my_module/assets/image.jpg);