HTML Version SASS Modification - Compilation Error
Hello together,
I downloaded the HTML file ("metronic_html_v8.1.2_demo5") and wanted to make design changes with SASS .
Some files just do not compile.
####################################
Compilation Error
Error: Can't find stylesheet to import.
╷
17 │ @import "bootstrap/scss/functions";
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\demo5\src\sass\_init.scss 17:9 @import
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\demo5\src\sass\plugins.scss 10:9 root stylesheet
--------------------
Compilation Error
Error: Can't find stylesheet to import.
╷
17 │ @import "bootstrap/scss/functions";
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\demo5\src\sass\_init.scss 17:9 @import
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\demo5\src\sass\style.scss 6:9 root stylesheet
--------------------
Compilation Error
Error: Undefined variable.
╷
8 │ @each $color, $value in $colors {
│ ^^^^^^^
╵
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\node_modules\bootstrap\scss\_root.scss 8:27 @import
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\demo5\src\sass\components\components.scss 6:9 root stylesheet
--------------------
Compilation Error
Error: Can't find stylesheet to import.
╷
22 │ @import "~select2/src/scss/core.scss";
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\plugins.scss 22:9 root stylesheet
--------------------
Generated:
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\cropper\cropper.css.map
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\cropper\cropper.css
--------------------
Generated:
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\demo5\src\plugins\fonticon\fonticon.css.map
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\demo5\src\plugins\fonticon\fonticon.css
--------------------
Generated:
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\cookiealert\cookiealert.css.map
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\cookiealert\cookiealert.css
--------------------
Generated:
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\jstree\jstree.css.map
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\jstree\jstree.css
--------------------
Generated:
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\leaflet\leaflet.css.map
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\leaflet\leaflet.css
--------------------
Generated:
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\tiny-slider\tiny-slider.css.map
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\tiny-slider\tiny-slider.css
--------------------
Generated:
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\vis-timeline\vis-timeline.css.map
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\vis-timeline\vis-timeline.css
--------------------
Generated:
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\demo5\dist\assets\plugins\global\fonts\fonticon\fonticon.css.map
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\demo5\dist\assets\plugins\global\fonts\fonticon\fonticon.css
--------------------
Generated:
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\prismjs\prismjs.css.map
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\prismjs\prismjs.css
--------------------
Generated:
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\jkanban\jkanban.css.map
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\jkanban\jkanban.css
--------------------
Watching...
--------------------
####################################
Can someone tell me whats wrong here?
I have done all the necessary steps as described in the doc (yarn, gulp, etc.).
I downloaded the HTML file ("metronic_html_v8.1.2_demo5") and wanted to make design changes with SASS .
Some files just do not compile.
####################################
Compilation Error
Error: Can't find stylesheet to import.
╷
17 │ @import "bootstrap/scss/functions";
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\demo5\src\sass\_init.scss 17:9 @import
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\demo5\src\sass\plugins.scss 10:9 root stylesheet
--------------------
Compilation Error
Error: Can't find stylesheet to import.
╷
17 │ @import "bootstrap/scss/functions";
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\demo5\src\sass\_init.scss 17:9 @import
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\demo5\src\sass\style.scss 6:9 root stylesheet
--------------------
Compilation Error
Error: Undefined variable.
╷
8 │ @each $color, $value in $colors {
│ ^^^^^^^
╵
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\node_modules\bootstrap\scss\_root.scss 8:27 @import
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\demo5\src\sass\components\components.scss 6:9 root stylesheet
--------------------
Compilation Error
Error: Can't find stylesheet to import.
╷
22 │ @import "~select2/src/scss/core.scss";
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\plugins.scss 22:9 root stylesheet
--------------------
Generated:
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\cropper\cropper.css.map
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\cropper\cropper.css
--------------------
Generated:
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\demo5\src\plugins\fonticon\fonticon.css.map
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\demo5\src\plugins\fonticon\fonticon.css
--------------------
Generated:
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\cookiealert\cookiealert.css.map
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\cookiealert\cookiealert.css
--------------------
Generated:
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\jstree\jstree.css.map
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\jstree\jstree.css
--------------------
Generated:
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\leaflet\leaflet.css.map
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\leaflet\leaflet.css
--------------------
Generated:
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\tiny-slider\tiny-slider.css.map
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\tiny-slider\tiny-slider.css
--------------------
Generated:
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\vis-timeline\vis-timeline.css.map
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\vis-timeline\vis-timeline.css
--------------------
Generated:
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\demo5\dist\assets\plugins\global\fonts\fonticon\fonticon.css.map
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\demo5\dist\assets\plugins\global\fonts\fonticon\fonticon.css
--------------------
Generated:
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\prismjs\prismjs.css.map
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\prismjs\prismjs.css
--------------------
Generated:
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\jkanban\jkanban.css.map
c:\Users\Toredo\Documents\Santo Projects\2022-08 TASS HTML Template\tass_files\metronic_theme\tools\webpack\plugins\custom\jkanban\jkanban.css
--------------------
Watching...
--------------------
####################################
Can someone tell me whats wrong here?
I have done all the necessary steps as described in the doc (yarn, gulp, etc.).
Replies (5)
Hi,
Did you do these commands in the tools folder?
May I know your node.js version?
Thanks
Did you do these commands in the tools folder?
cd metronic_html_v8.1.2_demo5/tools
yarn
gulpMay I know your node.js version?
Thanks
Hi Faizal,
thank you for your respond.
Yes yarn und gulp was executed successful.
My node.js version is v16.17.0
thank you for your respond.
Yes yarn und gulp was executed successful.
My node.js version is v16.17.0
Hi,
If your yarn and gulp were executed successful, could you please clarify how did you get the error above?
Thanks
If your yarn and gulp were executed successful, could you please clarify how did you get the error above?
Thanks
the error appears when I start the SASS-Compiler. Most of the files can be compiled, but as you can see some of the files occurs an error.
Hi
Are you using 3rd party plugin for SASS-Compiler? We build using gulp.
Thanks
Are you using 3rd party plugin for SASS-Compiler? We build using gulp.
Thanks
React Dev Vacancy
KeenThemes is looking for a Junior React or Vue developer to build awesome apps.
Apply
