2012-03-17 4 views
9

assets:precompile 작업의 이상한 동작이나 적어도 완전히 이해하지 못한 작업 앞에 나 자신을 발견했습니다.레일 에셋 : 이상한 동작을 사전 컴파일

그래서 웹 응용 프로그램에 Rails 3.1.3, Sprockets 2.0.3, Less 2.0.11을 사용하고 레이아웃에 부트 스트랩을 사용하므로 less-rails 2.1.8 이하도 사용하고 있습니다. -rails-bootstrap 2.0.8. here처럼 스타일을 사용자 정의했습니다.

내 자산의 구성은

입니다 : application.css.scss에서

stylesheets 
|--application.css.scss 
|--custom-style/ 
    |--variables.less 
    |--mixins.less 
    |--buttons.less 
|--custom-style.css.less 

내가 buttons.less

@import "twitter/bootstrap/reset"; 
//@import "twitter/bootstrap/variables"; // Modify this for custom colors, font-sizes, etc 
@import "custom-style/variables"; 
//@import "twitter/bootstrap/mixins"; 
@import "custom-style/mixins"; 
// And all the other standar twitter/bootstrap imports... 

// Other custom-style files to import 
@import "custom-style/buttons" 
//... 

// And other rules here 
//... 

마지막으로 할

//=require custom-style 

및 사용자 정의 스타일

을 나는 variables.lessmixins.less B에 정의 된 몇 가지 변수와 믹스 인을 사용합니다. 자세한 내용은 @white.buttonBackground입니다. 나는 위의 구성으로 bundle exec rake assets:precompile를 시작하면

작업이 실패하고이 오류 얻을 :

$ bundle exec rake assets:precompile 
/usr/local/rvm/rubies/ruby-1.9.3-p0/bin/ruby /usr/local/rvm/gems/ruby-1.9.3-p0/bin/rake assets:precompile:all RAILS_ENV=production RAILS_GROUPS=assets 
rake aborted! 
.buttonBackground is undefined 

하지만 내가 할 경우이

buttons.less --> buttons.css.less 

@import "buttons" --> @import "buttons.css.less" 

모든 것이 잘 작동 변경하는 것이입니다!

중첩 된 가져 오기로 작업 할 때 변수 및 함수가 적은 범위와 관련이 있습니까? 또는 더 적은 파서 또는 스프로킷이 가져 오기 트리를 처리하는 순서와 관련이 있습니다.

내가 누락되었거나 잘못된 방식으로 뭔가를하고 있습니까?

감사합니다 :)

참고 :이 난 원래 변수와 유지 mixin 파일로 오류가 발생, 그래서 그들로 수행 오버라이드 (override)과 연결되지 않은.

+2

"나는 자산의 이상한 행동 앞에서 나 자신을 발견했다 : 사전 컴파일 작업"- 우리 모두는 그렇지 않다 :) 또한 application.css.scss와 .less 파일을 혼합하는 것이 발행물. 나는/LESS/SASS 중 하나를 시도해보고 싶을 것이고 Sass는 @import 지시어를 인식하지 못하고있을 것이다. 필요하지 않으므로 application.css.scss-> application.css를 변경하고 Gemfile에서 sass-rails를 제거하고 도움이되는지 확인하십시오. 행운을 빌어 요 :) – sbeam

답변

0

파일의 이름을 buttons.css.less으로 변경했는데 @import (예 : @import "buttons")의 확장자를 유지하려고 했습니까?

그렇기 때문에 SCSS를 사용하면 정상적으로 작동합니다.

또 다른 생각은 application.css.less의 //=require custom-style@import "custom-style" 지정 문으로 대체하는 것입니다.

If you want to use multiple Sass files, you should generally use the Sass @import rule instead of these Sprockets directives. Using Sprockets directives all Sass files exist within their own scope, making variables or mixins only available within the document they were defined in.

+0

'@import "버튼이 작동하지 않습니다. 왜냐하면 덜 복잡한 인터프리터가'.css.less'가 아닌'.less' 파일을 찾는 것이기 때문입니다. – mokagio

+0

** 어딘가에 ** 링크 해주세요. *? 내가 아는 한'// = require'는 Sprockets과 대화하는 방법입니다 ... – mokagio

+0

여기 : http://guides.rubyonrails.org/asset_pipeline.html#manifest-files-and-directives - 아래쪽 노란색 상자 조금, 나는 그것을 대답에 꽂을 것이다. –

1

내가 지금 두 가지 가능성 중 하나를 생각할 수 :

1)을 Rails Guide here은 (SCSS/LESS로 처리되는) ​​(톱니로 처리되는) ​​//=require 세 이상 @import을 사용하는 것이 좋습니다 application.css.scss를 application.css로 변경해야합니다.덜 사용 : 대신 덜 컴파일러가 세미콜론에 대해 매우 까다로운입니다 //= require ...

2) 스프라켓의

@import "custom-style";

. @import "custom-style/buttons"이있는 것으로 나타났습니다. 문제가 실제로 간단하지만 시작일 경우 @import "custom-style/buttons";

Dunno가되어야합니다.

0

이것은 정말로 당신의 질문에 답하지 않지만, 당신이 새시를 섞어서 트위터 부트 스트랩을 덜 사용하는 유일한 이유입니까? 만약 당신이 단지 싫증이 나기를 좋아한다면, 저자가 덜 변환 할 수있는 부트 스트랩 보석 (bootstrap-sass)이 있습니다. 프로젝트에서 두 가지 모두를 저글링하기에 너무 많은 시간을 낭비하기 전에, 나는 완전히 하나 또는 다른 것을 사들였습니다.하지만 그건 제 의견입니다.

관련 문제