compiling component scss files angular

Question

so i wanted to use scss for my angular 4 project, i configured it with angular-cli config file, and everything is working, except one thing:

in my main style.scss file i import bootstrap variables file

@import './assets/styles/bootstrap/_variables.scss';
@import './assets/styles/bootstrap/bootstrap.scss';

@import "./assets/styles/datepicker.scss";
@import "./assets/styles/select2.scss";

i have a variable $gray-me defined in __variables.scss file.

when i want to use this variable in the style.scss file, it work as excpected, but when i want to use it in a compoenent scss file, it give me this errorr

Undefined variable: "$gray-me"

its like the component scss and global style.scss where compiled separatly.

so is there is a way to fix that and make them compile in one piece.

Sam Herrmann · Accepted Answer · 2017-07-13 14:00:18Z

1

Make sure you @import all required .scss files in your component.scss. The component.scss files are not global and therefore need to explicitly import all required references, i.e. @import "__variables".

answered Jul 13, 2017 at 14:00

Sam Herrmann

7,0285 gold badges33 silver badges61 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

compiling component scss files angular

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related