Request to update sass compiler to use dart sass instead of NodeScass/Ruby Scass
vmanthena opened this issue · comments
Koala 2.3.0
feature request?
Could you please update sass compiler to use dart sass instead of NodeScass/Ruby Scass?
Koala supports using other compiler instead of the default one with the Advanced Setting for Sass compiler. Try these steps:
- Download the standalone Dart Sass from https://github.com/sass/dart-sass/releases/tag/1.42.1, then extract and put it in your computer anywhere you want.
- Go to Koala > Settings > Sass.
- See Advanced Settings.
- Check Use the System Sass compiler
- Put the full path to Dart Sass compiler in the box below. (In my case, it is "C:\path\to\dart-sass\sass.bat".) Must not add any arguments after the file location because Koala will enclose all of this with double quote to support directory name with spaces.
- Modify the sass.bat to remove unsupported options which Koala will pass out (for its default Ruby Sass) and modify some options supported by Dart Sass. I put the following lines into sass.bat just before the real execution line.
!!! The BAT script here has error with space in scss file path. Please instead use the fixed one below.
set check_style=%arguments: nested=%
if not "%check_nested%"=="%arguments%" set style=expanded
set check_style=%arguments: expanded=%
if not "%check_style%"=="%arguments%" set style=expanded
set check_style=%arguments: compact=%
if not "%check_style%"=="%arguments%" set style=compressed
set check_style=%arguments: compressed=%
if not "%check_style%"=="%arguments%" set style=compressed
set sourcemap=
set check_sourcemap=%arguments:--sourcemap=%
if not "%check_sourcemap%"=="%arguments%" set sourcemap=--no-source-map
set arguments=%1 %2 %3 %4 --style=%style% %sourcemap%
Then enjoy conveniences from Koala.
Remark: Dart Sass supports only 2 options, source mapping [yes/no] and output style [expanded/compressed]. So we got only these 2 options usable in Koala.
There is a discussion about this issue at twbs/bootstrap#34693 (comment). You might follow the topic. There might be other better solution in the future.
Koala supports using other compiler instead of the default one with the Advanced Setting for Sass compiler. Try these steps:
- Download the standalone Dart Sass from https://github.com/sass/dart-sass/releases/tag/1.42.1, then extract and put it in your computer anywhere you want.
- Go to Koala > Settings > Sass.
- See Advanced Settings.
- Check Use the System Sass compiler
- Put the full path to Dart Sass compiler in the box below. (In my case, it is "C:\path\to\dart-sass\sass.bat")
- Modify the sass.bat to remove unsupported options which Koala will pass out (for its default Ruby Sass) and modify some options supported by Dart Sass. I put the following lines into sass.bat just before the real execution line.
set check_style=%arguments: nested=% if not "%check_nested%"=="%arguments%" set style=expanded set check_style=%arguments: expanded=% if not "%check_style%"=="%arguments%" set style=expanded set check_style=%arguments: compact=% if not "%check_style%"=="%arguments%" set style=compressed set check_style=%arguments: compressed=% if not "%check_style%"=="%arguments%" set style=compressed set sourcemap= set check_sourcemap=%arguments:--sourcemap=% if not "%check_sourcemap%"=="%arguments%" set sourcemap=--no-source-map set arguments=%1 %2 %3 %4 --style=%style% %sourcemap%
- Then enjoy conveniences from Koala.
Remark: Dart Sass will support only 2 options, source mapping [yes/no] and output style [expanded/compressed].
There is a discussion about this issue at twbs/bootstrap#34693 (comment). You might follow the topic. There might be other better solution in the future.
@zybersup Just tried your suggestion for Dart with Koala... whenever I try to compile it errors on every file. For example :
C:\Users\Support\Documents\My Web Sites\BS5\example.com\_config\scss\bootstrap.scss
'Web' is not recognized as an internal or external command, operable program or batch file. Web was unexpected at this time.
Any ideas? Does it not like the spaces in the file location or something? That is the only place I can think of that the word 'Web' is referenced.
Would appear either Koala or Dart doesn't like spaces in the file locations. I copied my folder to another location which doesn't have spaces in the location to the folder and it worked perfectly fine. Question is which one has the issue with that - Koala or Dart?
Any ideas? Does it not like the spaces in the file location or something? That is the only place I can think of that the word 'Web' is referenced.
I forgot to remark that we must not add any parameter after the file name. Only executable file location is allowed. (As far as I tried and saw the code and error message.)
Would appear either Koala or Dart doesn't like spaces in the file locations. I copied my folder to another location which doesn't have spaces in the location to the folder and it worked perfectly fine. Question is which one has the issue with that - Koala or Dart?
As far as I see the Koala script (referred here below), any space in the file locations will be enclosed with double quote before use. So it should not cause a problem.
koala/src/app/scripts/compilers/SassCompiler.js
Lines 65 to 70 in bbd142d
Anyway, your workaround can solve the problem. So it might be the case really.
Would appear either Koala or Dart doesn't like spaces in the file locations. I copied my folder to another location which doesn't have spaces in the location to the folder and it worked perfectly fine. Question is which one has the issue with that - Koala or Dart?
I tried searching the message and found that it came from Windows command line execution. So the problem is surely not with Dart. May be with Koala or child_process.exec() in Node.js which Koala called to execute the compiler.
This link might help. https://helpdeskgeek.com/how-to/fix-not-recognized-as-an-internal-or-external-command/
I changed my file path from C:\Users\Support\Documents\My Web Sites\BS5\example.com\_config\scss\bootstrap.scss to C:\Users\Support\Documents\MyWebSites\BS5\example.com\_config\scss\bootstrap.scss and everything compiled fine. So it was indeed the spaces in my file path that something doesn't like.
I never had that problem with Koala until I configured it to use Dart as per the guide you posted.
I forgot to remark that we must not add any parameter after the file name. Only executable file location is allowed. (As far as I tried and saw the code and error message.)
@zybersup I followed exactly what was shown in your post. Koala's executable path is set to "C:\Users\Support\Documents\~Compilers~\dart-sass\sass.bat" and the sass.bat currently contains the following :
@echo off
REM This script drives the standalone dart-sass package, which bundles together a
REM Dart executable and a snapshot of dart-sass.
set SCRIPTPATH=%~dp0
set arguments=%*
set check_style=%arguments: nested=%
if not "%check_nested%"=="%arguments%" set style=expanded
set check_style=%arguments: expanded=%
if not "%check_style%"=="%arguments%" set style=expanded
set check_style=%arguments: compact=%
if not "%check_style%"=="%arguments%" set style=compressed
set check_style=%arguments: compressed=%
if not "%check_style%"=="%arguments%" set style=compressed
set sourcemap=
set check_sourcemap=%arguments:--sourcemap=%
if not "%check_sourcemap%"=="%arguments%" set sourcemap=--no-source-map
set arguments=%1 %2 %3 %4 --style=%style% %sourcemap%
"%SCRIPTPATH%\src\dart.exe" "%SCRIPTPATH%\src\sass.snapshot" %arguments%
perhaps I misunderstood the sass.bat part of your guide? I inserted the lines above the exec line that was currently there.
You did it correctly as I said above. Previously I thought you mean the compiler path, which I checked it already that can get space in it. Now I got it right. The problem is about having spaces in the path to SCSS file.
Finally after hours of debugging the BAT script, which I am not an expert about, I found the cause and the way to fix it.
Please use the code below instead of the previous one. Put it right before the execution line.
call :strlen lenArg arguments
set check_style=%arguments: nested=%
call :strlen lenChk check_style
if not %lenChk%==%lenArg% set style=expanded
set check_style=%arguments: expanded=%
call :strlen lenChk check_style
if not %lenChk%==%lenArg% set style=expanded
set check_style=%arguments: compact=%
call :strlen lenChk check_style
if not %lenChk%==%lenArg% set style=compressed
set check_style=%arguments: compressed=%
call :strlen lenChk check_style
if not %lenChk%==%lenArg% set style=compressed
set sourcemap=
set check_sourcemap=%arguments:--sourcemap=%
call :strlen lenChk check_sourcemap
if not %lenChk%==%lenArg% set sourcemap=--no-source-map
set arguments=%1 %2 %3 %4 --style=%style% %sourcemap%
goto :run_sass
goto :eof
:strlen <resultVar> <stringVar>
(
setlocal EnableDelayedExpansion
(set^ tmp=!%~2!)
if defined tmp (
set "len=1"
for %%P in (4096 2048 1024 512 256 128 64 32 16 8 4 2 1) do (
if "!tmp:~%%P,1!" NEQ "" (
set /a "len+=%%P"
set "tmp=!tmp:~%%P!"
)
)
) ELSE (
set len=0
)
)
(
endlocal
set "%~1=%len%"
exit /b
)
rem This .BAT script to find length of variable is from jeb at https://stackoverflow.com/a/5841587.
:run_sass
I hope this time it will work as you expect.
Glad to know that. :)
However, there is a limitation using this script:
- the SCSS path must not have these words ' nested', ' expand', 'compact', ' compressed', and '--sourcemap', because these words will be removed out of the command so we will not get the result CSS.
You did it correctly as I said above. Previously I thought you mean the compiler path, which I checked it already that can get space in it. Now I got it right. The problem is about having spaces in the path to SCSS file.
Finally after hours of debugging the BAT script, which I am not an expert about, I found the cause and the way to fix it.
Please use the code below instead of the previous one. Put it right before the execution line.
call :strlen lenArg arguments set check_style=%arguments: nested=% call :strlen lenChk check_style if not %lenChk%==%lenArg% set style=expanded set check_style=%arguments: expanded=% call :strlen lenChk check_style if not %lenChk%==%lenArg% set style=expanded set check_style=%arguments: compact=% call :strlen lenChk check_style if not %lenChk%==%lenArg% set style=compressed set check_style=%arguments: compressed=% call :strlen lenChk check_style if not %lenChk%==%lenArg% set style=compressed set sourcemap= set check_sourcemap=%arguments:--sourcemap=% call :strlen lenChk check_sourcemap if not %lenChk%==%lenArg% set sourcemap=--no-source-map set arguments=%1 %2 %3 %4 --style=%style% %sourcemap% goto :run_sass goto :eof :strlen <resultVar> <stringVar> ( setlocal EnableDelayedExpansion (set^ tmp=!%~2!) if defined tmp ( set "len=1" for %%P in (4096 2048 1024 512 256 128 64 32 16 8 4 2 1) do ( if "!tmp:~%%P,1!" NEQ "" ( set /a "len+=%%P" set "tmp=!tmp:~%%P!" ) ) ) ELSE ( set len=0 ) ) ( endlocal set "%~1=%len%" exit /b ) rem This .BAT script to find length of variable is from jeb at https://stackoverflow.com/a/5841587. :run_sassI hope this time it will work as you expect.
I followed your suggest and it works however in this way command line flag options like --style=expanded and --no--source-map doesn't work anymore. Is it possible modify the .bat to have working either dart sass in koala and dart sass from command line?
I followed your suggest and it works however in this way command line flag options like --style=expanded and --no--source-map doesn't work anymore. Is it possible modify the .bat to have working either dart sass in koala and dart sass from command line?
Those 2 options [--style=expanded and --no--source-map] should still work. But the others do not and it because of incompatible options between the old bundled compiler and the dart one.
Even for the compatible options, it is very difficult to make the .bat script to detect parameters sent out from Koala and modify them into new ones if you are not an expert on .bat script. Surely I am not.
I followed your suggest and it works however in this way command line flag options like --style=expanded and --no--source-map doesn't work anymore. Is it possible modify the .bat to have working either dart sass in koala and dart sass from command line?
Those 2 options [--style=expanded and --no--source-map] should still work. But the others do not and it because of incompatible options between the old bundled compiler and the dart one.
Even for the compatible options, it is very difficult to make the .bat script to detect parameters sent out from Koala and modify them into new ones if you are not an expert on .bat script. Surely I am not.
Those two options don't work anymore from command-line. Like workaround I copied the dart-sass folder and renaming it in dart-sass-koala, restored the original sass.bat in default dart-sass for command line dart-sass compile. I modified the sass.bat in dart-sass-koala like pointed out here and after I linked koala with this new sass.bat file. In this way It work either with Koala and with command line