Compiling SCSS to CSS in Visual Studio Code


Topic: Compiling SCSS to CSS in Visual Studio Code

crumbdav pro premium asked 4 years ago

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.)


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.


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Open

Specification of the issue
  • 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
Tags