how livereload builded file with SASS on sublime text 4?

Viewed 79

I install sublime text plugin :

SublimeOnSaveBuild
LiveReload
SASS Build

I have livereload plugin on navigator, it's works fine on .css file

now, I want works with .sass file, so I add my own buildscript :

{

  "cmd": [
    // "/home/matrix/.rbenv/shims/sass",
    // "--update",
    // "--stop-on-error",
    // "--no-cache",
    // "--style", "compressed",
    // "--sourcemap=none",
    // "--load-path", "${file_path}",
    // "$file:${file_path}/../css/${file_base_name}.min.css",

    // "&",       

    // "sass",
    "/home/matrix/.rbenv/shims/sass",
    "--watch",
    // "--update",
    "--stop-on-error",
    "--no-cache",
    "--sourcemap=none",
    "--load-path", "${file_path}",
    "$file:${file_path}/../css/${file_base_name}.css"
  ],

  "selector": "source.sass, source.scss",
  "line_regex": "Line ([0-9]+):",

  "osx":
  {
    "path": "/usr/local/bin:$PATH"
  },

  "windows":
  {
    "shell": "true"
  }

}

I don't find how include /home/matrix/.rbenv/shims/ in PATH, so I put here, it's works fine, with SublimeOnSaveBuild it generate .css from .sass each time I save.

If I change and save .css, liveReload continue to works fine, but there is no cascading trigger reload, so when I save .sass, it make .css but nothing was reload on browser, if I go in .css generated and save it, it will realod.

My problem is : how tell to livereload watching css file ?

I tried to change --update to --watch in script but nothing change

BONUS problem : if I tried to launch both cmd (commented), the & cause an syntax error, so I don't know how make min and normal file at same time

BONUS problem 2 : unminimified css file look like :

#formulaire fieldset {
   background-color: rgba(40, 160, 0, 0.2);
   font-size: 17px; }

how can I configure output syntax, with brcket at the line, like :

#formulaire fieldset 
{
   background-color: rgba(40, 160, 0, 0.2);
   font-size: 17px; 
}
1 Answers

You can use Gulp live-reload

  • Install gulp live-reload npm install gulp gulp-sass gulp-livereload express --save-dev

Futher i leave it to you

Related