Topic: Compiling SCSS to CSS in Visual Studio Code
Expected behavior I am trying to compile the mdb.scss file into a mdb.css file using Visual Studio Code and Live Sass Compiler extension. I am receiving the following errors (full compiling message included):
Compiling Sass/Scss Files: c:\EduClarity\AspNetZero\AngularApp\Analytics\angular\node_modules\ng-uikit-pro-standard\assets\scss\bootstrap\bootstrap-grid.scss c:\EduClarity\AspNetZero\AngularApp\Analytics\angular\node_modules\ng-uikit-pro-standard\assets\scss\bootstrap\bootstrap-reboot.scss c:\EduClarity\AspNetZero\AngularApp\Analytics\angular\node_modules\ng-uikit-pro-standard\assets\scss\bootstrap\bootstrap.scss c:\EduClarity\AspNetZero\AngularApp\Analytics\angular\node_modules\ng-uikit-pro-standard\assets\scss\mdb.scss c:\EduClarity\AspNetZero\AngularApp\Analytics\angular\node_modules\ng-uikit-pro-standard\assets\scss\msc-pro.scss
c:\EduClarity\AspNetZero\AngularApp\Analytics\angular\node_modules\ng-uikit-pro-standard\assets\scss\msc.scss
Generated : c:\EduClarity\AspNetZero\AngularApp\Analytics\angular\node_modules\ng-uikit-pro-standard\assets\scss\bootstrap\bootstrap-grid.css
c:\EduClarity\AspNetZero\AngularApp\Analytics\angular\node_modules\ng-uikit-pro-standard\assets\scss\bootstrap\bootstrap-grid.css.map
Generated : c:\EduClarity\AspNetZero\AngularApp\Analytics\angular\node_modules\ng-uikit-pro-standard\assets\scss\bootstrap\bootstrap-reboot.css
c:\EduClarity\AspNetZero\AngularApp\Analytics\angular\node_modules\ng-uikit-pro-standard\assets\scss\bootstrap\bootstrap-reboot.css.map
Compilation Error Error: File "c:\EduClarity\AspNetZero\AngularApp\Analytics\angular\node_modules\ng-uikit-pro-standard\assets\scss\~@angular\cdk\overlay-prebuilt.css" not found on line 31 of sass/c:\EduClarity\AspNetZero\AngularApp\Analytics\angular\node_modules\ng-uikit-pro-standard\assets\scss\mdb.scss
@import '~@angular/cdk/overlay-prebuilt.css'; --------^
Compilation Error Error: Undefined variable: "$radio-label-pl". on line 15 of sass/c:\EduClarity\AspNetZero\AngularApp\Analytics\angular\node_modules\ng-uikit-pro-standard\assets\scss\core\msc_radio-pro.scss from line 1 of sass/c:\EduClarity\AspNetZero\AngularApp\Analytics\angular\node_modules\ng-uikit-pro-standard\assets\scss\msc-pro.scss
padding-left: $radio-label-pl;
------------------^
Generated : c:\EduClarity\AspNetZero\AngularApp\Analytics\angular\node_modules\ng-uikit-pro-standard\assets\scss\bootstrap\bootstrap.css
c:\EduClarity\AspNetZero\AngularApp\Analytics\angular\node_modules\ng-uikit-pro-standard\assets\scss\bootstrap\bootstrap.css.map
Compilation Error Error: Undefined variable: "$white-base". on line 5 of sass/c:\EduClarity\AspNetZero\AngularApp\Analytics\angular\node_modules\ng-uikit-pro-standard\assets\scss\core\msc_footers.scss from line 1 of sass/c:\EduClarity\AspNetZero\AngularApp\Analytics\angular\node_modules\ng-uikit-pro-standard\assets\scss\msc.scss
color: $white-base;
-----------^
Actual behavior
Resources (screenshots, code snippets etc.)
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Open
- User: Pro
- Premium support: No
- Technology: MDB Angular
- MDB Version: 10.0.0
- Device: Windows 10 x64
- Browser: Firefox
- OS: Windows 10
- Provided sample code: No
- Provided link: No
Arkadiusz Idzikowski staff commented 4 years ago
We would need more information about the tools you used and specific reproduction steps we need to follow to recreate this problem on our end.
JoseDR120 commented 4 years ago
That extension is for local scss files if you want to compile large amount of scss you'll need to install sass as devDependencie, npm install -D sass or yarn add -D sass
Arkadiusz Idzikowski staff commented 4 years ago
Which version of sass do you use? We tried to compile this file on our end and it compiled without errors. Please provide some reproduction steps we need to follow to reproduce the problem.