Grunt-contrib-watch没有看到新文件

Question

我像这样制作了Gruntfile.js:

'use strict';

module.exports = function (grunt) {
grunt.loadNpmTasks('grunt-favicons');
grunt.loadNpmTasks('grunt-contrib-imagemin');
grunt.loadNpmTasks('grunt-bake');
grunt.loadNpmTasks('grunt-contrib-htmlmin');
grunt.loadNpmTasks('grunt-contrib-less');
grunt.loadNpmTasks('grunt-autoprefixer');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-cwebp');
grunt.loadNpmTasks('grunt-responsive-images');
grunt.loadNpmTasks('grunt-retinafy');
grunt.loadNpmTasks('grunt-spritesmith');
grunt.loadNpmTasks('grunt-notify');
grunt.loadNpmTasks('grunt-contrib-watch');

require('load-grunt-tasks')(grunt);

grunt.initConfig({
    pkg : grunt.file.readJSON('package.json'),
    watch: {
        html: {
            files: ['./assets/**/*.html'],
            tasks: ['html'],
            options: {
                spawn: false,
                livereload: true,
            },
        },
        less: {
            files: ['./assets/less/**/*.less'],
            tasks: ['less_files'],
            options: {
                spawn: false,
                livereload: true,
            },
        },
        js: {
            files: ['./assets/js/**/*.js'],
            tasks: ['js'],
            options: {
                spawn: false,
                livereload: true,
            },
        },
        img: {
            files: ['./assets/images/**/*.png'],
            tasks: ['img'],
            options: {
                spawn: false,
                livereload: true,
            },
        },
        favicon: {
            files: ['./assets/favicon/favicon.png'],
            tasks: ['favicon'],
            options: {
                spawn: false,
                livereload: true,
            },
        },
        icons: {
            files: ['./assets/sprites/**/*.png'],
            tasks: ['icons'],
            options: {
                spawn: false,
                livereload: true,
            },
        },
    },
    shell: {
        can_i_use_update: {
            command: 'npm update caniuse-db'
        }
    },
    favicons: {
        options: {},
        icons: {
            src: 'assets/favicon/favicon.png',
            dest: 'dist/favicons/'
        }
    },
    imagemin: {
        images: {
            options: {
                optimizationLevel: 4,
                progressive: true,
                interlaced: true
            },
            files: [{
                expand: true,
                cwd: './dist/images',
                src: ['**/*.{png,jpg,jpeg,gif}'],
                dest: './dist/images/'
            }]
        },
        favicons: {
            options: {
                optimizationLevel: 4,
                progressive: true,
                interlaced: true
            },
            files: [{
                expand: true,
                cwd: './dist/favicons',
                src: ['**/*.{png,jpg,jpeg,gif}'],
                dest: './dist/favicons/'
            }]
        },
        sprite: {
            options: {
                optimizationLevel: 4,
                progressive: true,
                interlaced: true
            },
            files: {
                './dist/images/sprite.png': './dist/images/sprite.png',
            }
        },
    },
    bake: {
        build: {
            options: {},
            files: [{
                expand: true,
                cwd: './assets/',
                src: ['*.html'],
                dest: './dist/',
                ext: '.html'
            }]
        }
    },
    htmlmin: {
        dist: {
            options: {
                removeComments: true,
                collapseWhitespace: true,
                conservativeCollapse: true,
                preserveLineBreaks: true
            },
            files: [{
                expand: true,
                cwd: './dist/',
                src: ['**/*.html'],
                dest: './dist/'
            }]
        }
    },
    less: {
        build: {
            options: {
                compress: true,
                ieCompat: true,
                sourceMap: true,
                sourceMapFilename: './dist/css/style.map',
                sourceMapURL: 'css/style.map'
            },
            files: {
                "./dist/css/style.css": "./assets/less/style.less"
            }
        }
    },
    autoprefixer: {
        options: {
            browsers: ['last 5 versions', 'ie 8', 'ie 9', '> 5%']
        },
        build: {
            "./dist/css/style.css":"./dist/css/style.css"
        },
    },
    concat: {
        options: {},
        dist: {
            src: ['./assets/js/*.js'],
            dest: './dist/js/script.js',
        },
    },
    uglify: {
        build: {
            options: { compress: true },
            files: { "./dist/js/script.js":"./dist/js/script.js" }
        }
    },
    cwebp: {
        build: {
            options: {
                q: 80,
                alpha_q: 80
            },
            files: [{
                expand: true,
                cwd: './dist/images/', 
                src: ['**/*.{png,jpg,jpeg,gif}'],
                dest: './dist/images/webp'
            }]
        }
    },
    responsive_images: {
        build: {
            options: {
                engine:"im",
                sizes: [{
                    width: 640,
                },{
                    width: 1024,
                },{
                    width: 1920
                }]
            },
            files: [{
                expand: true,
                src: ['**.{jpg,gif,png}'],
                cwd: './assets/images/',
                custom_dest: './dist/images/responsive/{%= width %}/'
            }]
        }
    },
    retinafy: {
        build: {
            options: {
                sizes: {
                    '75%':  { suffix: '@1.5x' },
                    '100%': { suffix: '@2x' }
                }
            },
            files: [{
                expand: true,
                cwd: './dist/images/',
                src: ['**/*.{jpg,jpeg,gif,png}'],
                dest: './dist/images/'
            }],
        }
    },
    sprite:{
        all: {
            src: './assets/sprites/*.png',
            dest: './dist/images/sprite.png',
            destCss: './assets/less/sprite.less'
        }
    },
    notify_hooks: {
        options: {
            enabled: true,
            max_jshint_notifications: 5, // maximum number of notifications from jshint output 
            title: "Project Name", // defaults to the name in package.json, or will use project directory's name 
            success: true, // whether successful grunt executions should be notified automatically 
            duration: 2 // the duration of notification in seconds, for `notify-send only 
        }
    }
});

grunt.task.run('notify_hooks');

grunt.registerTask('html', ['bake', 'htmlmin']);
grunt.registerTask('less_files', ['less', 'autoprefixer']);
grunt.registerTask('js', ['concat', 'uglify']);
grunt.registerTask('img', ['responsive_images', 'retinafy', 'imagemin:images', 'cwebp']);
grunt.registerTask('favicon', ['favicons', 'imagemin:favicons']);
grunt.registerTask('icons', ['sprite', 'imagemin:sprite']);
grunt.registerTask('default', ['html','less_files','js','img','favicon','icons','watch']);
};

一切正常,甚至是grunt-contrib手表,但仅适用于旧文件和修改过的文件.它在监视文件夹中看不到任何新文件.它不适用于不同版本的grunt-contrib-watch.有任何想法吗？

node -v v0.12.7

npm -v 2.11.3

OSX 10.10.4约塞米蒂

Answer 1

我想你应该./在开始时剥掉它.它永远不需要被假装.它可能与这个问题有关,当./它被添加时,会打破一些事件.

尝试将选项设置为:

options: {
  event: ['changed', 'added', 'deleted']
}

默认设置设置为all但已报告有时它不起作用.

如果全部失败,则有另一种解决方案.放下grunt-contrib-watch并尝试grunt-simple-watch.在这里你可以找到grunt-contrib-watch导致麻烦的原因.

旁注:我意识到你手动加载所有任务然后load-grunt-task像这样使用:

grunt.loadNpmTasks('grunt-favicons');
grunt.loadNpmTasks('grunt-contrib-imagemin');
grunt.loadNpmTasks('grunt-bake');
grunt.loadNpmTasks('grunt-contrib-htmlmin');
grunt.loadNpmTasks('grunt-contrib-less');
grunt.loadNpmTasks('grunt-autoprefixer');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-cwebp');
grunt.loadNpmTasks('grunt-responsive-images');
grunt.loadNpmTasks('grunt-retinafy');
grunt.loadNpmTasks('grunt-spritesmith');
grunt.loadNpmTasks('grunt-notify');
grunt.loadNpmTasks('grunt-contrib-watch');

require('load-grunt-tasks')(grunt);

供您参考; 您不需要加载所有任务,因为load-grunt-tasks它会自动为您执行.load-grunt-tasks扫描packages.json文件以查找您拥有的任务并自动加载它们.您可以安全地删除所有grunt.loadNpmTasks(xxx)将要加载的任务(只要它被提及packages.json)