2014-01-08 4 views
2

하나의 SASS 파일을 저장하고 "output_style"및 "environment"설정이 다른 두 개의 파일을 출력하고 싶습니다. 같은 SASS에 압축 작업을 다른 확장자를 가진 파일을 다시 실행하는 config.rb 파일에Compass/Codekit에서 다른 설정으로 두 개의 CSS에 하나의 SASS 컴파일

  1. 기능,하지만 "output_style"과 "환경을 업데이트합니다

    두 가지 방법 내가 실험 한 ".

  2. config.rb의 "output_style"및 "environment"변수를 업데이트하는 각 파일의 맨 위에 두 개의 SASS 파일을 수동으로 저장하십시오.

저는 Grunt에서이 작업을 수행 할 수 있습니다.하지만 CodeKit을 사용하는 것이 좋을 것 같습니다.

옵션, 대안?

+2

다른 사람이 필요로하는 것은 놀랍습니다 ... –

답변

0

1 단계 : 개발 구성 config.rb은 다음과 같아야합니다

# Basic configuration. 
http_path = "/" 
css_dir = "css" 
sass_dir = "sass" 
images_dir = "images" 
javascripts_dir = "js" 

# You can select your preferred output style here (can be overridden via the command line). 
# Options: ":expanded", ":nested", ":compact", ":compressed" 
output_style = :expanded 

# Enable debugging comments that display the original location of your selectors. 
line_comments = true 

# Re-compile the sass files using the minified configuration. 
on_stylesheet_saved do 
    `compass compile -c config_minified.rb --force` 
end 

2 단계 : 당신은 다른 설정 파일 config_minified.rb을 추가해야하고 다음과 같아야합니다

# Basic configuration. 
http_path = "/" 
css_dir = "css/minified" 
sass_dir = "sass" 
images_dir = "images" 
javascripts_dir = "js" 

# Compressed the output for production. 
output_style = :compressed 

# Disable debugging comments for production. 
line_comments = false 

3 단계 : 평소와 같이 컴파일하면 갈 준비가됩니다 :

/css/minified/style.css이 자동으로 생성됩니다. 당신은 프로젝트 당 상대 경로를 엉망으로하지 않을 경우 사용하기 위해 당신이 config_minified.rb을 변경할 수 있습니다

/css 
/css/style.css 
/css/minified/style.css 
/images 
/sass 
/sass/style.scss 
config.rb 
config_minified.rb 

편집 : 이러한 단계를 수행 한 후에
는해야 프로젝트는 다음과 같습니다 루트 폴더에 상대적인 css 폴더

# do not use the css_dir = "css/minified" because it will break the images. 
css_dir = "css-minified"