Compass watch compiles sass or scss files using compass open-source CSS Authoring Framework. The way mentioned in this blog is config compass in docker-compose so that every time any sass changed, compass watch will run automatically.
First, you need to configure your folders in a config.rb file, placed on the sass root folder. Here's an example folder structure, and its corresponding config.rb file.
/src /compass /sass config.rb /app /public /css
So the config.rb should set like below:
# Require any additional compass plugins here. #Folder settings css_dir = "../public/css" #where the CSS will saved sass_dir = "sass" #where our .scss files are images_dir = "../public/img" #the folder with your images # You can select your preferred output style here (can be overridden via the command line): output_style = :expanded # After dev :compressed # To disable debugging comments that display the original location of your selectors. Uncomment: line_comments = true # Obviously preferred_syntax = :scss
You need to add the followings to your docker-compose file. We use antonienko/compass-watch image here.
compass: build: antonienko/compass-watch command: watch --poll /src/compass volumes: - /src:/src
If all your code base in ./docroot folder and the drupal theme directory is "./docroot/sites/all/themes/bootstrap_subtheme". config.rb locates in "/var/www/html/sites/all/themes/bootstrap_subtheme/sass". You can set up docker-compose like below:
compass: image: antonienko/compass-watch command: watch --poll /var/www/html/sites/all/themes/bootstrap_subtheme/sass volumes: - ./docroot/sites/all/themes/bootstrap_subtheme:/var/www/html/sites/all/themes/bootstrap_subtheme/