如何使用Grunt.js和Compass使用Bootstrap for Sass？

Question

我想使用一个官方Sass端口的Bootstrap与任务运行器Grunt.js和框架指南针,但根据手册(https://github.com/twbs/bootstrap-sass#bootstrap-for-sass)我没有成功.

成功安装了这些宝石:

bootstrap-sass (3.1.0.1, 3.1.0.0)
compass (0.12.2)
sass (3.2.14, 3.2.13, 3.2.12)

我的Gruntfile.js:

'use strict';

module.exports = function (grunt) {

grunt.initConfig({

  pkg: grunt.file.readJSON('package.json'),

  compass: {
      options: {
        httpPath: './',
        sassDir: '<%= pkg.css.src %>',
        cssDir: '<%= pkg.css.dest %>',
        imagesDir: '<%= pkg.graphics.cssPath %>'
      },
      dev: {
        options: {
          environment: 'development',
          outputStyle: 'expanded',
          force: true
        }
      },
      prod: {
        options: {
          environment: 'production',
          outputStyle: 'compressed',
          force: true
        }
      }
    },

});

grunt.loadNpmTasks('grunt-contrib-compass');

grunt.registerTask('default', ['compass:dev']);
};

在我的custom.scss开头,我有:

@import "compass";
@import "boostrap";

当我输入

咕噜

在命令行中我收到以下错误:

Syntax error: File to import not found or unreadable: boostrap.
   Load paths:
     c:/Users/Radek/WWW/svobodanabytek/src/sass
     C:/Ruby193/lib/ruby/gems/1.9.1/gems/compass-0.12.2/frameworks/blueprint/stylesheets
     C:/Ruby193/lib/ruby/gems/1.9.1/gems/compass-0.12.2/frameworks/compass/stylesheets
     Compass::SpriteImporter
        on line 2 of c:/Users/Radek/WWW/svobodanabytek/src/sass/custom.scss

没有第2行(@import"boostrap";)一切正常.

我该怎么做才能开始在Grunt中使用bootstrap-sass gem？安装一些新的Grunt插件？谢谢你的回答.

Answer 1

在使用bootstrap-contrib-sass长时间遇到同样的问题后,我能够正常工作.

在您的Gruntfile中,在includePathsconfig变量中指定指南针和bootstrap-sass gems的位置:

options: {
    compass: true,
    includePaths: [
        '/var/www/.rvm/gems/ruby-2.1.1/gems/bootstrap-sass-3.1.1.0/vendor/assets/stylesheets',
        '/var/www/.rvm/gems/ruby-2.1.1/gems/compass-0.12.4/frameworks/compass/stylesheets'
    ],
    ...
}

旁注:您可以使用该grunt --verbose标志运行grunt 以转储有助于调试的额外信息.