1

私は Grunt を初めて使用します – これまでのところ気に入っています (さようなら Codekit) – しかし、コンパス URL ヘルパー (image-url()、font-url()) の出力に間違ったパスが含まれるという問題があります。これが私のグラントファイルです。

module.exports = function (grunt) {
    grunt.initConfig(
        {
            pkg        : grunt.file.readJSON('package.json'),
            compass    : {
                dev : {
                    options : {
                        httpPath       : '/',
                        sassDir        : 'scss/scss',
                        cssDir         : 'css/compiled',
                        imagesDir      : 'images',
                        javascriptsDir : 'js',
                        fontsDir       : 'fonts',
                        outputStyle    : 'nested',
                        relativeAssets : true
                    }
                }
            },
            cssmin     : {
                dev : {
                    files : {
                        'css/min/ctips-global.min.css' : [
                            'css/compiled/global/base.css',
                            'css/compiled/global/header.css',
                            'css/compiled/global/footer.css',
                            'css/compiled/global/navigation.css',
                            'css/compiled/global/entry-content.css',
                            'css/compiled/global/widgets.css',
                            'css/compiled/global/animations.css'
                        ]
                    }
                }
            },
            uglify     : {
                options : {
                    mangle : false
                },
                dev     : {
                    files : {
                        'js/min/modernizr-latest.min.js' : ['js/vendor/modernizr/modernizr-latest.js']
                    }
                }
            },
            watch      : {
                css : {
                    files   : ['scss/scss/**', 'Gruntfile.js'],
                    tasks   : ['compass', 'cssmin'],
                    options : {
                        nospawn : true
                    }
                },
                js  : {
                    files : ['Gruntfile.js'],
                    tasks : ['uglify']
                }
            },
            concurrent : {
                options : {
                    logConcurrentOutput : true
                },
                dev     : {
                    tasks : ['watch:css', 'watch:js']
                }
            }
        });
    grunt.loadNpmTasks('grunt-concurrent');
    grunt.loadNpmTasks('grunt-contrib-uglify');
    grunt.loadNpmTasks('grunt-contrib-watch');
    grunt.loadNpmTasks('grunt-contrib-cssmin');
    grunt.loadNpmTasks('grunt-contrib-compass');
    grunt.registerTask('default', ['compass', 'cssmin', 'uglify']);
    grunt.registerTask('dev', ['concurrent:dev']);
};

「grunt dev」を実行すると、Grunt は警告なしで実行されます (必要なすべてのリソースを見つけることができることを示します)。ただし、コンパス URL ヘルパーの出力には、常に gruntfile が存在するディレクトリがありません。

次のようにディレクトリを追加すると...

...
options : {
                        httpPath       : '/',
                        sassDir        : 'scss/scss',
                        cssDir         : 'css/compiled',
                        imagesDir      : 'mydirectory/images',
                        javascriptsDir : 'js',
                        fontsDir       : 'mydirectory/fonts',
                        outputStyle    : 'nested',
                        relativeAssets : true
                    }
...

...結果の出力は正しいですが、grunt はリソースが見つからないという一連の警告をスローします。エラーの例は次のとおりです。

WARNING: 'Brown-Regular.eot' was not found (or cannot be read) in /Applications/MAMP/htdocs/website.com.au/website/content/themes/mydirectory/mydirectory/fonts

そのため、コンパスが httpPath を認識している場所と Grunt が私のプロジェクトにあると認識している場所との間に多少の不一致があるようですが、これを修正する方法がわかりません。

現在、Compass を実行すると、イメージとフォントが見つからない (間違ったディレクトリを探している) という警告が大量に表示されますが、ウォッシュですべて問題なく表示されます...

この不一致が発生している理由を理解するためにどこを見ればよいかについて、誰かが私にガイダンスを与えることができますか?

4

0 に答える 0