【发布时间】：2015-07-28 14:32:36
【问题描述】：
我这样制作 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 watch，但仅适用于旧文件和修改后的文件。它在监视文件夹中看不到任何新文件。它不适用于不同版本的 grunt-contrib-watch。有什么想法吗？
节点-v v0.12.7
npm -v 2.11.3
OSX 10.10.4 优胜美地
【问题讨论】：
标签： node.js macos gruntjs grunt-contrib-watch