0

我有帶bower的bootstrap的最新版本。我正在使用gulp任務將其傳遞給css。在我的style.scss我正在運行如何在自舉中啓用flex-true scss 4

@import "bootstrap"; 
@import "font-awesome"; 

所有這些都是工作文件。我正在閱讀有關如何在此處啓用Flexbox的文檔:http://v4-alpha.getbootstrap.com/getting-started/flexbox/

該文檔說:打開_variables.scss文件並找到$ enable-flex變量。這是否意味着我需要進入bower_components/bootstrap/scss /並找到_variables.scss,並在那裏更改它?

我一口我已經引導定義爲./bower_components/bootstrap/scss

如何處理這種不重寫,應有盡有,而且更重要的是,我怎麼能彎曲正確?我只是在這裏添加我的gulp文件,以防萬一它需要。

const gulp = require('gulp'), 
    sass = require('gulp-sass'), 
    autoprefix = require('gulp-autoprefixer'), 
    notify = require("gulp-notify"), 
    bower = require('gulp-bower'); 

let config = { 
    bootstrapDir: './bower_components/bootstrap', 
    fontawesomeDir: './bower_components/font-awesome', 
    publicDir: './public', 
    bowerDir: './bower_components' 
} 

gulp.task('bower', function() { 
    return bower() 
     .pipe(gulp.dest(config.bowerDir)) 
}); 

gulp.task('fonts', function() { 
    return gulp.src(config.bowerDir + '/font-awesome/fonts/**.*') 
     .pipe(gulp.dest('./public/assets/fonts')); 
}); 

gulp.task('css', function() { 
    return gulp.src('./public/assets/sass/style.scss') 
     .pipe(sass({ 
      includePaths: [config.bootstrapDir + '/scss', config.fontawesomeDir + '/scss'], 
     })) 
     .pipe(gulp.dest(config.publicDir + '/assets/css')); 
}); 

// Watch task 
gulp.task('watch',function() { 
    gulp.watch('./public/assets/sass/**/*.scss', ['css']); 
}); 

gulp.task('default', ['bower', 'fonts', 'css']); 

回答

1

在我的情況下,在我導入bootstrap之前添加了_custom.scss和@import。 Bootstrap確實有一個用於這種覆蓋的_custom.scss文件,但是當您使用bower更新bootstrap時,將會丟失這些更改。

0

他們應該已將部分_custom.scss添加到.gitignore。 檢查_custom.scss註釋:

// Bootstrap overrides 
// 
// Copy variables from `_variables.scss` to this file to override default values 
// without modifying source files. 

可變$enable-flex以局部_variables.scss定義。

https://github.com/twbs/bootstrap/blob/v4-dev/scss/_variables.scss#L113 https://github.com/twbs/bootstrap/blob/v4-dev/scss/_custom.scss https://github.com/twbs/bootstrap/blob/v4-dev/.gitignore