Olá, sou iniciante em GULP
e estou com o seguinte problema, o codigo abaixo, que simplemente minifica o JS
e o CSS
, funciona perfeitamente se rodar as funções no default
e rodar o GULP
. O problema é que com o Watch
ele não funciona, ele cria o arquivo mas em branco.
Ja respondendo algumas perguntas:
- Sim, ele é iniciado corretamente, ou seja, o
GULP
detecta a mudança no arquivo e executa a função. - Sim, no
default
ele minifica corretamente. - Sim, caso não possua o arquivo minificado, ele cria, ou seja, ele entra na função, mas por algum motivo ele não consegue ler o
CSS
/JS
quando a função é chamada peloWatch
.
Código abaixo:
var css = [
'./css/estilo.css'
];
var js = [
'./js/app.js'
];
var gulp = require('gulp');
var jsmin = require('gulp-jsmin');
var rename = require('gulp-rename');
var uglify = require("gulp-uglify");
var concat = require("gulp-concat");
var watch = require('gulp-watch');
var cssmin = require("gulp-cssmin");
var stripCssComments = require('gulp-strip-css-comments');
gulp.task('minify-css', function(){
gulp.src(css)
.pipe(stripCssComments({all: true}))
.pipe(cssmin())
.pipe(rename({suffix: '.min'}))
.pipe(gulp.dest('./css/min/'));
});
gulp.task('minify-js', function () {
gulp.src(js)
.pipe(jsmin())
.pipe(rename({suffix: '.min'}))
.pipe(gulp.dest('./js/min/'));
});
gulp.task('default', ['watch']);
gulp.task('watch', function() {
gulp.watch(js, ['minify-js']);
gulp.watch(css, ['minify-css']);
});
Já tentei declarar o caminho do CSS
diretamente na função ao invés de chamar a variável CSS
. Já tentei também declarar a variável como global, mas nada disso muda o resultado que é o arquivo em branco.