SASS 부하 동적 변수는 웹팩 내부

Question

내가 자산을 구축하기 위해 보석 rails/webpack을 사용하고 레일,하지만 난처럼 브랜드에 따라 동적 SCSS를 구축해야합니다

//admin.scss 
@import 'variables-<%= 'brand-name' %>'; 

body { 
    background: $primary-color; 
} 

내가 로더를 추가 시도했다 :

{ 
    test: /\.scss(\.erb)?/, 
    loader: 'sass-loader', 
    options: { importExtensions: ['.scss', '.scss.erb', '.css'] } 
} 

하지만 작동하지 않았습니다. 그런 식으로 할 수있는 방법이 있습니까?

Answer 1

별도의 컨트롤러 액션에서이 작업을 수행합니다 :

layout.html.erb

<%= stylesheet_link_tag stylesheet_path() %>

스타일 시트 쇼 컨트롤러 액션을

# Render the template to a string 
css = Sass::Engine.new(
    render_to_string("path/to/erb_template", :layout => false), 
    syntax:  :scss, 
    cache:  false, 
    read_cache: false, 
    style:  :standard, 
    sprockets: { 
    context:  self.view_context, 
    } 
).render 

# respond with the rendered string 
respond_to do |format| 
    format.css { render plain: css, :content_type => "text/css" } 
end 

당신은 다음의 ERB 변수를 포함 할 수 있습니다 주형. 이것은 모든 단일로드에서 sass 엔진을 통해 처리되므로 프로덕션 환경에서이를 캐시해야합니다.

귀하의 모든 멋진를 별도의 파일로 유지하려는 경우 ERB로 렌더링하기 위해 하나의 파일에 변수를 넣고 나머지는 텍스트 파일로만 읽습니다.

rendered_sass = [render_to_string("stylesheets/colours", :layout => false), 
    File.read(Rails.root.join("app", "javascript", "stylesheets", "main.scss")), 
    File.read(Rails.root.join("app", "javascript", "stylesheets", "base.scss")), 
    File.read(Rails.root.join("app", "javascript", "stylesheets", "reset.scss")), 
    File.read(Rails.root.join("app", "javascript", "stylesheets", "type.scss")), 
    File.read(Rails.root.join("app", "javascript", "stylesheets", "layout.scss")), 
    File.read(Rails.root.join("app", "javascript", "stylesheets", "map.scss")), 
    File.read(Rails.root.join("app", "javascript", "stylesheets", "audio-player.scss")), 
    File.read(Rails.root.join("app", "javascript", "stylesheets", "slider.scss"))].join("\n\r")