我想将 Bootstrap 的官方 Sass 端口与任务运行器 Grunt.js 和框架 Compass 一起使用,但根据手册(https://github.com/twbs/bootstrap-sass#bootstrap-for-sass)我没有成功。
成功安装了这些 gem:
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";
当我输入
grunt
在命令行中我收到以下错误:
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 插件?
感谢您的任何回答。
最佳答案
在使用 bootstrap-contrib-sass 遇到同样的问题这么长时间后,我能够得到这个工作。 .
在你的 Gruntfile 中,在 includePaths
中指定你的 compass 和 bootstrap-sass gem 的位置。配置变量:
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标志转储有助于调试的额外信息。
关于twitter-bootstrap - 如何使用 Grunt.js 和 Compass 为 Sass 使用 Bootstrap?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21562608/