Segui todos os passos da aula, não sei a razão de não funcionar. Alguém pode me ajudar?
//gulpfile.js
var gulp = require('gulp')
,imagemin = require('gulp-imagemin')
,clean = require('gulp-clean')
,concat = require('gulp-concat')
,htmlReplace = require('gulp-html-replace')
,uglify = require('gulp-uglify')
,usemin = require('gulp-usemin')
,cssmin = require('gulp-cssmin')
,browserSync = require('browser-sync')
,jshint = require('gulp-jshint')
,jshintStylish = require('jshint-stylish')
,csslint = require('gulp-csslint')
,autoprefixer = require('gulp-autoprefixer');
gulp.task('default', ['copy'], function() {
gulp.start('build-img', 'usemin');
});
gulp.task('copy', ['clean'], function() {
return gulp.src('src/**/*')
.pipe(gulp.dest('dist'));
});
gulp.task('clean', function() {
return gulp.src('dist')
.pipe(clean());
});
gulp.task('build-img', function() {
return gulp.src('dist/img/**/*')
.pipe(imagemin())
.pipe(gulp.dest('dist/img'));
});
gulp.task('usemin', function() {
return gulp.src('dist/**/*.html')
.pipe(usemin({
js: [uglify],
css: [autoprefixer]
}))
.pipe(gulp.dest('dist'));
});
gulp.task('server', function() {
browserSync.init({
server: {
baseDir: 'src'
}
});
gulp.watch('src/js/*.js').on('change', function(event){
gulp.src(event.path)
.pipe(jshint())
.pipe(jshint.reporter(jshintStylish));
});
gulp.watch('src/css/*.css').on('change', function(event){
gulp.src(event.path)
.pipe(csslint())
.pipe(csslint.reporter());
});
gulp.watch('src/**/*').on('change', browserSync.reload);
});
//package.json
{
"name": "projeto",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"gulp": "gulp"
},
"author": "",
"license": "ISC",
"devDependencies": {
"browser-sync": "^2.24.4",
"gulp": "^3.9.0",
"gulp-autoprefixer": "^3.0.2",
"gulp-clean": "^0.3.1",
"gulp-concat": "^2.6.1",
"gulp-csslint": "^0.2.0",
"gulp-cssmin": "^0.1.7",
"gulp-html-replace": "^1.6.2",
"gulp-imagemin": "^2.3.0",
"gulp-jshint": "^1.11.2",
"gulp-uglify": "^1.5.4",
"gulp-usemin": "^0.3.29",
"jshint-stylish": "^2.0.1"
}
}
//trecho de exemplo do index.min.css
.painel li:hover {
background-color: rgba(255,255,255,0.8);
transition: all 0.7s;
}
.painel li:hover {
-webkit-transform: scale(1.2);
-ms-transform: scale(1.2);
transform: scale(1.2);
}
.painel li:hover {
-webkit-transform: scale(1.2) rotate(-5deg);
-ms-transform: scale(1.2) rotate(-5deg);
transform: scale(1.2) rotate(-5deg);
}