使用Grunt时,让Compass将css编译到特定目录中



我想建立一个基本的预处理工作流程。我设置了一个目录结构,如下所示:

- website-root
- - index.html
- - css
- - pre-processing
- - - Gruntfile.js
- - - package.json
- - - sass
- - - - test.scss

我正在使用Grunt,因为我想在未来进行一些高级构建操作。我也在使用指南针,因为我想使用它的混音器等

我现在想做的只是简单地设置一个监视任务,将"test.scs"编译到网站根目录css文件夹中的"test.css"文件中。然而,无论我尝试什么,当我在控制台中键入"compass watch",然后更改"test.scs"文件的内容时,结果总是将"test.css"文件编译到"预处理"文件夹中一个名为"样式表"的新文件夹中。

Gruntfile.js的内容是:

module.exports = function (grunt) {
    'use strict';
    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),

        compass: {
            dev: {
                options: {
                    sassDir: 'scss/',
                    cssDir: '/css/',
                    relativeAssets: true
                }
            }
        },
        watch: {
            sass: {
                files: ['scss/{,*/}*.{scss,sass}'],
                tasks: ['compass:dev']
            }
        }
    });
    grunt.loadNpmTasks('grunt-contrib-compass');
    grunt.loadNpmTasks('grunt-contrib-watch');
    grunt.registerTask('default', ['compass:dev']);
}

package.json文件包含以下内容:

{
  "name": "Test",
  "version": "0.0.1",
  "devDependencies": {
    "grunt": "^0.4.5",
    "grunt-contrib-compass": "^1.0.1"
  }
}

因此Gruntfile.js中的cssDir选项似乎没有影响。

有人能说明为什么会发生这种情况吗?我是一个完全的预处理新手,所以可能会错过一些明显的东西!

谢谢。

当您键入"compass watch"时,您直接运行compass。你正试图用咕噜声来实现这一点。你需要输入"咕哝手表"。

最新更新