Переменные ENV в файле scss - PullRequest
Новая
       17

Переменные ENV в файле scss

0 голосов
/ 02 сентября 2018

Я бы хотел установить цвет навигационной панели и изображения jumbotron с помощью переменных среды.

В моем файле application.yml у меня есть 

NAVBAR_COLOR: "#FF7F50"    
JUMBOTRON_PIC: 'asset-url("somePic.png")'

Я изменил custom.css.scss на custom.css.scss.erb и добавил следующие строки 

.navbar-default {
    background-color: <%= ENV["NAVBAR_COLOR"] %> ; 
}

.jumbotron{
  background-image: <%= ENV["JUMBOTRON_PIC"] %> ;
}

однако ни один из вышеперечисленных вариантов не работает.

Есть идеи, почему?

Ответы [ 2 ]

0 голосов
/ 05 сентября 2018

Что касается обновления переменных ENV, вам необходимо перезапустить сервер, как указано в одном из комментариев.

Для корректной загрузки фонового изображения я обнаружил, что работает следующее: 

#config/application.yml
JUMBOTRON_PIC: "/assets/somePic.png"
NAVBAR_COLOR: "#1ac2ff"

#layouts/mylayout.html.erb
 <style>          
   .jumbotron{
        background-image:  url( "<%= ENV["JUMBOTRON_PIC"] %>" );
      }      

   .navbar-default {
        background-color: <%= ENV["NAVBAR_COLOR"] %> ; 
  }  
 </style>
0 голосов
/ 02 сентября 2018

.scss файлы не являются .erb файлами, поэтому <%= .... %> не будет работать. Добавьте к нему дополнительное расширение .erb и убедитесь, что оно предварительно скомпилировано на стороне сервера, а не локально, и будет работать только один раз в момент его предварительной компиляции.

Лично я бы так не поступил. Для этого я бы просто сделал это внутри моего шаблона: 

#layouts/mylayout.html.erb

...
<head>
  <style>
    .navbar-default {
      background-color: <%= ENV["NAVBAR_COLOR"] %> ; 
    }
    .jumbotron{
      background-image: <%= ENV["JUMBOTRON_PIC"] %> ;
    }
  </style>
</head>
...

Ресурсы предварительно компилируются, а затем доставляются быстро, поэтому не стоит делать так, чтобы они зависели от переменных env, и еще хуже, если вы планируете обновить эту переменную после предварительной компиляции.

...