1

SASSファイルをコンパイルするために、うなり声を介してコンパスを使用しています。私のディレクトリ構造は次のようになります。

project/
    Gruntfile.js
    package.json
    sass/
        part1/
            part1.sass
    css/

そして私のGruntfile.js：

grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    compass: {
        std: {
            options: {
                sassDir: 'sass',
                cssDir: 'css',
                specify: 'sass/part1/part1.sass',
                raw: 'disable_warnings = true\n'
            }
        }
    }
});

gruntfile を実行すると、Compass は に出力しますが、代わりproject/css/part1/part1.cssに に出力したいです。project/css/part1.cssこれどうやってするの？現在、on_stylesheet_saved フックを使用してファイルを移動していますが、あまりエレガントではありません。

質問が明確であることを願っています。事前に感謝します。

4

1 に答える 1

1

私はあなたの環境を再現しました。さらに単純化できGruntfile.jsます：

module.exports = function(grunt) {

    // Main project configuration
    grunt.initConfig({
        // Read NPM package information
        pkg: grunt.file.readJSON('package.json'),
        // Compass
        compass: {
            std: {
                options: {
                    cssDir: 'css',
                    sassDir: 'sass'
                }
            }
        }
    });

    // Load the grunt tasks
    grunt.loadNpmTasks('grunt-contrib-compass');

    // Compile production files
    grunt.registerTask('std', [
        'compass:std'
    ]);

    // Default task(s)
    grunt.registerTask('default', 'std');

};

あなたが得ているのは、予想されるコンパスの動作です。

grunt-contrib-compassの readmeを少し読むと、次のようになります。

コンパスはフォルダ レベルで動作します。このため、src/dest を指定せずに、オプションsassDirとcssDirオプションを定義します。

つまり、コンパイル先のパスを変更することはできず、CSSすべてのコンパイル済みファイルが書き込まれるルート フォルダーのパスのみを決定します。

煩わしいcompassかもしれませんが、コンパイルをディレクトリ構造に忠実に保つことは、むしろやりたいことであると想定しているだけです-これはやや独断的です.

次の方法で、必要なことを行うことができます。

  1. ファイルを再構築して、ファイルが意図したとおりにcompassなると予想される場所に配置します。part1つまり、ディレクトリをドロップして、フォルダーpart1.sassの下に配置します。sass
  2. CSSのような一時フォルダーにファイルをコンパイルし、 ( grunt-contrib-copytmp ) のような別のタスクを使用してすべてのファイルをフォルダーにコピーし、 ( grunt-contrib-clean ) のようなタスクを使用してファイルを空にします。タスクはその順序でロードされるため、正しい順序で実行されます。copyCSScsscleantmp
于 2014-04-01T21:14:26.557 に答える