const gulp = require('gulp'); //引入gulp及其插件
const uglify = require('gulp-uglify');
const babel = require('gulp-babel');
const sass = require('gulp-sass');
const minicss = require('gulp-minify-css');
//es6轉es5
gulp.task("ese", function () {
return gulp.src("src/js/*.js")// ES6 源碼存放的路徑
.pipe(babel({
presets:['es2015']
}))
.pipe(uglify())
.pipe(gulp.dest("./dist/js")); //轉換成 ES5 存放的路徑
});
//sass轉css並且壓縮合併成一個css
gulp.task('scss',() => {
return gulp.src('src/sass/*.scss') //sass文件夾下所有scss文件
.pipe(sass()) //使用sass插件把scss編譯成css
.pipe(minicss()) //壓縮css
.pipe(gulp.dest('./dist/css')) //輸出到./dist/css
})
gulp.task('css',() => {
return gulp.src('src/css/*.css') //sass文件夾下所有scss文件
.pipe(minicss()) //壓縮css
.pipe(gulp.dest('./dist/css')) //輸出到./dist/css
})
gulp.task('img',() => {
return gulp.src('src/images/*')
.pipe(gulp.dest('./dist/images'))
})
// 監視文件變化,自動執行任務
gulp.task('watch', function () {
gulp.watch('src/js/*.js', gulp.series("ese"));
gulp.watch('src/sass/*.scss', gulp.series("scss"));
gulp.watch('src/css/*.css', gulp.series("css"));
gulp.watch('src/images/*', gulp.series("img"));
})
gulp.task('start',gulp.series('ese','scss','img','css','watch'))
gulp配置gulpfile
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.