Строка удаляется после компиляции из переменной в SCSS при использовании цикла for или каждого цикла - PullRequest
Новая
       3

Строка удаляется после компиляции из переменной в SCSS при использовании цикла for или каждого цикла

0 голосов
/ 25 мая 2019

Я устанавливаю фоновое изображение в другом классе, используя цикл в SCSS.Но это не дает ожидаемый результат после компиляции.Я новичок в SCSS.Пожалуйста, помогите мне.Вот что я попробовал. 

 $class: avatar;
 $imgSrc: assets/avatars/av;
 $imgType: PNG;
 @for $i from 1 through 10 {
 .#{$class}#{$i} {
   background: url(#{$imgSrc}#{$i}.#{$imgType})  center / contain 
     no-repeat;
  }
 }

Я тоже так пытаюсь 

 $class: avatar;
 $imgSrc: assets/avatars/av;
 $imgType: PNG;
 @for $i from 1 through 10 {
 .#{$class}#{$i} {
   background: url('assets/avatars/av#{$i}.PNG')  center / contain 
     no-repeat;
  }
 }

В обоих случаях.Я получаю вывод, как это: 

.avatar1 {
  background: url('av1.PNG') center / contain no-repeat;
 }
.avatar2 {
  background: url('av2.PNG') center / contain no-repeat;
}
.
.

Я ожидаю вывод, как это. 

.avatar1 {
  background: url('assets/avatars/av1.PNG') center / contain no- 
   repeat;
 }
 .avatar2 {
  background: url('assets/avatars/av2.PNG') center / contain no- 
   repeat;
 }
 .
 .
...