Foundation에서 SASS 변수를 덮어 쓰지 않도록하려면 어떻게합니까?

Question

Bower를 사용하여 Foundation SASS를 설치했습니다. 그럼 기초를 수입하고 초기화 다음 명령에 의해 내 main.scss에있다 :

@import "../vendor/foundation-sites/scss/foundation.scss"; 
@include foundation-everything(true); // Init the foundation 

문제는, 설정 파일, _settings.scss, 내가 대체 할 필요가 foundation.scss 가져 오기가 있다는 것입니다. Bower 디렉토리의 파일들, 즉 vendor/을 건드리지 않아야하므로, 변경 사항을 main.scss에 만들어야합니다. 그리고 아니요, _settings.scss은 !default 기능을 사용하지 않습니다. (가) 이제까지 덮어하지 않습니다 단지 있도록 포함하기 전에 변수를 정의 할 수있는 방법이

$global-font-size: 100%; 
$global-width: rem-calc(1200); 
$global-lineheight: 1.5; 

거기에 다음과 같이 설정을 정의하는 방법의 조각은 무엇입니까? 뭔가 같은 ..

$global-font-size: 16px !important; 
$global-width: 1000px !important; 
$global-lineheight: 1 !important;  
@import "../vendor/foundation-sites/scss/foundation.scss"; 
@include foundation-everything(true); // Init the foundation 

Answer 1

두 경우, 두 방법 :

당신은 내가 일을 쉽게 할 symbolic link를 사용

이물

에서 패키지를 유지해야합니다. 내 프로젝트 파일을 살펴보십시오.

bower_component/foundation/scss/{...whatever}.scss 

가 그럼 난/재단/SCS들 폴더를 .bower_component하는 심볼릭 링크를 만들 것입니다 :

• 나는 정자에 기초를 설치해야합니다.

  src/scss/foundation  # this is a symbolic link to -> ./bower_component/foundation/scss 
  

• 는 그리고 나는 bower_component에서 사용자 정의 할 파일을 복사합니다.

  src/scss/my_settings.scss # copied from foundation/scss folder 
  

• 그리고 나는 내 자신의 scss를 추가합니다. 내 모든 사용자 정의를 가져

  @import 'my_settings' ; 
  @import '...other_customization...' 
  @import 'foundation/foundation' ; 
  

• 그런 다음 src/scss/main.scss를 구축 모두 함께 foundation.scss, 그리고 모든

  src/scss/main.scss 
  

  는 잘 작동합니다.

그런 다음 걱정없이 보어와 함께 기초 버전을 유지할 수 있습니다. bower_components/foundation의 변경 사항에 관계없이 폴더 이름과 상대 경로가 올바른지 확인하십시오. 모든 것이 정상입니다.

---

글쎄, 버전은 그다지 중요하지 않습니다.

자신에게 질문하십시오. 파운더에 의해 유지되는 재단에 도움이되는 것은 무엇입니까? 좋은 이유가 없다면 bower_component 폴더에서 기초를 옮기고 원하는대로 변경할 수 있습니다.

Bower는 사용자에게 자체 빌드 시스템을 지정하지 않으며 개발자에게 라이브러리 (AMD, CommonJS 등)를 포함하는 방법을 규정하지 않습니다.) 모두 Bower는 프로젝트에 필요한 패키지의 올바른 버전과 종속성을 설치합니다. 다른 말로하면 : 올바른 라이브러리에 대한 소스 파일과 필요한 모든 것을 특수 폴더에 다운로드합니다. 다른 모든 것은 개발자입니다. 인용구 : Artem Sapegin