简体   繁体   中英

Bootstrap-Sass using Grunt

I have installed bootstrap using sass, however my scss files are not compiling to the css folder.

I was able to install the bootstrap, using bower. This is my gruntfile.js

/*jslint node: true */
module.exports = function(grunt) {
grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),

    sass: {
        options: {
            loadPath: ['./bower_components/bootstrap-sass/assets/stylesheets']
        },
        dist: {
            options: {
                outputStyle: 'expanded',
                sourceMap: false
            },
            files: {
                'css/bootstrap.css' : 'stylesheets/_bootstrap.scss',
            }
        }
    }, // sass

    compass: {
        dev: {
            options: {
                config: 'config.rb'
            }
        } // dev
    }, //compass

    watch: {
        options: {
            livereload: true,
            dateFormat: function(time) {
                    grunt.log.writeln('The watch finished in ' + time + 'ms at ' + (new Date()).toString());
                    grunt.log.writeln('Waiting for more changes...');
                } //date format function
        }, //options
        scripts: {
            files: ['*.js']
        }, // scripts
        //Live Reload of SASS
        sass: {
            files: ['stylesheets/*.scss', 'stylesheets/bootstrap/*.scss'],
            tasks: ['sass']
        }, //sass
        css: {
            files: ['stylesheets/*.scss', 'stylesheets/bootstrap/*.scss'],
            tasks: ['compass']
        },
        html: {
            files: ['*.html']
        }
    }, //watch

    postcss: {
        options: {
            processors: [
                require('autoprefixer-core')({
                    browsers: 'last 2 versions'
                })
            ]
        }
    }, //post css

    jshint: {
        options: {
            reporter: require('jshint-stylish')
        },
        target: ['*.js', 'js/*.js']
    } //jshint
});

grunt.loadNpmTasks('grunt-sass');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-compass');
grunt.loadNpmTasks('grunt-postcss');
grunt.loadNpmTasks('grunt-contrib-jshint');

grunt.registerTask('build', ['sass']);
grunt.registerTask('default', ['build', 'watch', 'compass', 'jshint']);
}

I would like to know, what step I am missing, because I have followed the directory paths correctly. My config.rb file, I have changed the sass directory to stylesheets.

When I run, sudo grunt, no errors are found but the stylesheet is not compiling.

In SCSS, files starting with _ (underscore) are typically ignored. See: http://sass-lang.com/documentation/file.SASS_REFERENCE.html#partials

This also applies to grunt-sass.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM