4

我正在尝试通过grunt.js和npm将我的（其中有一些其他文件链接到它，style.scss例如）文件转换为 css 。但是我收到了这个错误：_variable.scss_mixins.scss

Error: File to import not found or unreadable: compass.
        on line 5 of sass/style.scss

1: // typorgraphy
2: @import "base/typography";
3: 
4: // compass
5: @import "compass";
6: 
7: // import files
8: @import "base/import";
9: 
10: // mixins

这是我的gruntfile.js：

module.exports = function(grunt) {

  // Project configuration.
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),

    compass: {      
    dist: {        
      options: {      
        sassDir: 'sass',
        cssDir: 'css',
        environment: 'production'
      }
    },
    dev: {              
      options: {
        sassDir: 'sass',
        cssDir: 'css'
      }
    }
  },

    watch: {
        sass:{
            files: ['sass/*.scss'],
            tasks: ['sass', 'cssmin']
        }
    },

    sass: {
        dist: {
            files: {
                'css/style.css' : 'sass/style.scss'
            }
        }
    },

    concat: {
        options: {
            separator: ';',
            stripBanners: true,
             banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n'
        },

        dist: {
            src: ['js/*.js'],
            dest: 'js/main.min.js'
        }
    },


    uglify:{
        options: {
            manage: false,
            preserveComments: 'all' //preserve all comments on JS files
        },
        my_target:{
            files: {
                'js/main.min.js' : ['js/*.js']
            }
        }
    },


    cssmin:{
        my_target:{
            files: [{
                expand: true,
                cwd: 'css/',
                src: ['*.css', '!*.min.css'],
                dest: 'css/',
                ext: '.min.css'

            }]
        }
    }

  });

  // Load the plugin that provides the "compass" task.
  grunt.loadNpmTasks('grunt-contrib-compass');

     // Load the plugin that provides the "watch" task.
  grunt.loadNpmTasks('grunt-contrib-watch');

     // Load the plugin that provides the "sass" task.
  grunt.loadNpmTasks('grunt-contrib-sass');

    // Load the plugin that provides the "uglify" task.
  grunt.loadNpmTasks('grunt-contrib-uglify');

      // Load the plugin that provides the "concat" task.
  grunt.loadNpmTasks('grunt-contrib-concat');

   // Load the plugin that provides the "cssmin" task.
  grunt.loadNpmTasks('grunt-contrib-cssmin');

   // Default task(s).
  grunt.registerTask('default', ['uglify','cssmin']);
};

当我运行时grunt sass，它给了我那些错误。指南针已经安装，我输入“grunt compass”以确保它正在运行。

任何的想法？

4

1 回答 1

3

使用grunt-contrib-sass而不是grunt-sass.

此任务要求您安装 Ruby 和 Sass。如果您使用的是 OS X 或 Linux，您可能已经安装了 Ruby；ruby -v在您的终端中进行测试。确认已安装 Ruby 后，运行gem install sass以安装 Sass。

还要确保compass选择true. 默认情况下，它设置为false.

阅读此内容以获取更多信息：指南针选项

这是一个例子：

sass: {
        dist: {
            options: {                 
                compass: true,
            },
            files: {
                'css/style.css' : 'sass/style.scss'
            }
        }
    },
  • grunt-sass使用 libsass，它是 C++ 中的 Sass 编译器，不支持指南针。

此任务使用 libsass，它是 C++ 中的 Sass 编译器。与最初的 Ruby 编译器相比，这个编译器要快得多，但缺少一些功能，尽管改进很快。它也不支持指南针。如果您更喜欢更稳定但更慢的东西，请查看 grunt-contrib-sass。

于 2015-11-23T13:39:15.743 回答