make "libsass" an optional dependency

reflex/compiler/compiler.py

@@ -8,8 +8,6 @@ from re import IGNORECASE as RE_IGNORECASE
 from re import compile as re_compile
 from typing import TYPE_CHECKING, Dict, Iterable, Optional, Tuple, Type, Union
 
-from sass import compile as sass_compile
-
 from reflex import constants
 from reflex.compiler import templates, utils
 from reflex.components.base.fragment import Fragment
@@ -23,6 +21,7 @@ from reflex.components.component import (
 from reflex.config import environment, get_config
 from reflex.state import BaseState
 from reflex.style import SYSTEM_COLOR_MODE
+from reflex.utils import console
 from reflex.utils.exec import is_prod_mode
 from reflex.utils.imports import ImportVar
 from reflex.utils.prerequisites import get_web_dir
@@ -196,6 +195,8 @@ def _compile_root_stylesheet(stylesheets: list[str]) -> str:
         else []
     )
 
+    try:
+        sass_compile = None
         while len(stylesheets):
             stylesheet = stylesheets.pop(0)
             if not utils.is_valid_url(stylesheet):
@@ -244,18 +245,37 @@ def _compile_root_stylesheet(stylesheets: list[str]) -> str:
                         / RE_SASS_SCSS_EXT.sub(".css", str(stylesheet)).strip("/")
                     )
                     target.parent.mkdir(parents=True, exist_ok=True)
+
+                    if stylesheet_full_path.suffix == ".css":
+                        target.write_text(
+                            data=stylesheet_full_path.read_text(),
+                            encoding="utf8",
+                        )
+                    else:
+                        if sass_compile is None:
+                            from sass import compile as sass_compile
+                        else:
+                            pass
+
                         target.write_text(
                             data=sass_compile(
-                        filename=str(stylesheet_full_path), output_style="compressed"
+                                filename=str(stylesheet_full_path),
+                                output_style="compressed",
                             ),
                             encoding="utf8",
                         )
                 else:
                     pass
 
-            stylesheet = f"./{RE_SASS_SCSS_EXT.sub('.css', str(stylesheet)).strip('/')}"
+                stylesheet = (
+                    f"./{RE_SASS_SCSS_EXT.sub('.css', str(stylesheet)).strip('/')}"
+                )
 
             sheets.append(stylesheet) if stylesheet not in sheets else None
+    except ImportError:
+        console.error(
+            """The `libsass` package is required to compile sass/scss stylesheet files. Run `pip install "libsass>=0.23.0"`."""
+        )
 
     return templates.STYLE.render(stylesheets=sheets)
 

tests/units/compiler/test_compiler.py

@@ -155,7 +155,9 @@ def test_compile_stylesheets(tmp_path: Path, mocker):
 
     # NOTE: the css file is also inserted into the s(a|c)ss preprocessor, which compressed the result, which means we don't have the tab, return,... characters.
     expected_result = "button.rt-Button{border-radius:unset !important}\n"
-    assert (project / ".web" / "styles" / "styles.css").read_text() == expected_result
+    assert (project / ".web" / "styles" / "styles.css").read_text() == (
+        assets_dir / "styles.css"
+    ).read_text()
     assert (
         project / ".web" / "styles" / "preprocess" / "styles_a.css"
     ).read_text() == expected_result