1

Bundler (gem 'bootstrap', '~> 4.0.0.alpha6')를 사용하여 부트 스트랩 4를 설치했고 bundle exec compass create SProject1 -r bootstrap --using bootstrap을 실행하여 컴퍼스로 새 프로젝트를 만들었습니다. 내가 가지고 :부트 스트랩 4 _bootstrap-variables.scss 파일이 컴파일 중입니다

directory SProject1/ 
directory SProject1/javascripts/ 
directory SProject1/javascripts/bootstrap/ 
directory SProject1/sass/ 
directory SProject1/stylesheets/ 
    create SProject1/config.rb 
    create SProject1/sass/styles.scss 
    create SProject1/sass/_bootstrap-variables.scss 
    create SProject1/javascripts/bootstrap/alert.js 
    create SProject1/javascripts/bootstrap/button.js 
    create SProject1/javascripts/bootstrap/carousel.js 
    create SProject1/javascripts/bootstrap/collapse.js 
    create SProject1/javascripts/bootstrap/dropdown.js 
    create SProject1/javascripts/bootstrap/modal.js 
    create SProject1/javascripts/bootstrap/popover.js 
    create SProject1/javascripts/bootstrap/scrollspy.js 
    create SProject1/javascripts/bootstrap/tab.js 
    create SProject1/javascripts/bootstrap/tooltip.js 
    create SProject1/javascripts/bootstrap/util.js 
    create SProject1/javascripts/bootstrap-sprockets.js 
    create SProject1/javascripts/bootstrap.js 
    create SProject1/javascripts/bootstrap.min.js 
    error SProject1/sass/styles.scss (Line 194 of SProject1/sass/_bootstrap-variables.scss: Undefined variable: "$grid-breakpoints".) 
Compilation failed in 1 files. 

나는 (분명히) 같은 오류 얻을 컴파일하려고하는 경우 :

require 'bootstrap' 
require 'compass/import-once/activate' 
# Require any additional compass plugins here. 
require 'autoprefixer-rails' 

# Set this to the root of your project when deployed: 
http_path = "/" 
css_dir = "stylesheets" 
sass_dir = "sass" 
images_dir = "images" 
javascripts_dir = "javascripts" 

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

# To enable relative paths to assets via compass helper functions. Uncomment: 
# relative_assets = true 

# To disable debugging comments that display the original location of your selectors. Uncomment: 
# line_comments = false 


# If you prefer the indented syntax, you might want to regenerate this 
# project again passing --syntax sass, or you can uncomment this: 
# preferred_syntax = :sass 
# and then run: 
# sass-convert -R --from scss --to sass sass scss && rm -rf sass && mv scss sass 

on_stylesheet_saved do |file| 
    css = File.read(file) 
    map = file + '.map' 

    if File.exists? map 
    result = AutoprefixerRails.process(css, 
     from: file, 
     to: file, 
     map: { prev: File.read(map), inline: false }) 
    File.open(file, 'w') { |io| io << result.css } 
    File.open(map, 'w') { |io| io << result.map } 
    else 
    File.open(file, 'w') { |io| io << AutoprefixerRails.process(css) } 
    end 
end 
012 : 여기

modified sass/styles.scss 
    error sass/styles.scss (Line 194 of sass/_bootstrap-variables.scss: Undefined variable: "$grid-breakpoints".) 

내 config.rb입니다

필자는 문서에서와 같이 Autoprefixer를 추가했으나 파일의 나머지 부분은 그대로이며 이라는 이상한 오류로 인해 컴파일 할 수 없기 때문에 아직 수정하지 않았습니다. "$ grid -breakpoints ", 내가 _bootstrap-variables.scss는 오는 방법 그건 말은, 내가 할 무엇인지 모르겠습니다 ...

답변

1

_bootstrap-variables.scss 변수 부트 스트랩에 의해 정의된다 를 오버라이드 (override)하는 장소입니다. 전체 파일이 기본적으로 으로 주석 처리되는 방식에 유의하십시오. 이는 이러한 변수를 무시하지 않음을 의미합니다.

검사 오류가 발생하기 쉬운 부분 보여준다

187 // $grid-breakpoints: (
188 // xs: 0, 
189 // sm: 576px, 
190 // md: 768px, 
191 // lg: 992px, 
192 // xl: 1200px 
193 //); 
194 @include _assert-starts-at-zero($grid-breakpoints); 

브레이크 포인트의 세트를 정의하는 선 위의 행의 주석 194

에서 아직 정의 $ 그리드 - 중단 변수를 사용하는 믹스 인 포함 나를 위해 문제를 해결했다. 주어진 중단 점 값은 (https://v4-alpha.getbootstrap.com/layout/overview/) here처럼 부트 스트랩이 사용하는 것과 동일합니다. 도움이

희망,

건배이를 설명하기위한

+0

감사합니다. 웬일인지 나는이 간단한 단계를 간과했다. – Robert