CODEWITHSUNDEEP
csssassgulp-sassnode-sass
shabarinath
shabarinath

Reputation: 603

How to check undefined variable in sass

iam trying to set color var in local (site specific) and a global(generic) sass file to add colors to websites in AEM. I have followed following approaches to check undefined. But none of them seems to be working. getting undefined variable $light-gray... Iam using gulp sass 4.0.1

@if variable-exists($light-gray) {
		color: $light-gray;
	}else{
		color: lightgray;
	}
  
  /*------------------------------------------*/
  
  if($light-gray, $light-gray, lightgray)

What would be the other approach

Upvotes: 1

Views: 3244

Answers (1)

shabarinath
shabarinath

Reputation: 603

I figured the issue. Its giving undefined coz i was defining @if variable-exists($my-variable) not @if variable-exists(my-variable) .. Since only string is being considered as param in @if condition., and using @, It is converting the entire variable including @ and getting var undefined.

Hence answer is @if variable-exists(my-variable)

Another interesting I have found is, the variable we are defining should not be any standard color code value. If defined any standard colorcode, SASS automatically throws an error 'param should be a string'... 'standard color code cannot be considered as srting'...

e.g. @gray: #ccc ., on passing gray as a variable name, SASS throws an error saying 'it is expecting string'.

Thought this additional input might help few people.

Upvotes: 4

Related Questions