第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定

前端工具--gulp的使用

標(biāo)簽:
前端工具

全文照抄 猴子猿 http://www.cnblogs.com/giggle/p/5389188.html , 感谢猴子兄让我理解了gulp,之前看视频看的一头雾水。

1.全局安装gulp:目的是在命令行里使用gulp的命令
{
npm install gulp -g
}

2.命令行中cd到项目目录,局部安装gulp(如果不在项目中再次安装会报错,据说这样是为了避免发生版本冲突)
{
npm install gulp
}

3.在项目目录下新建一个gulpfile.js文件(必须这个名字,这个文件算是一个配置文件),编写我们的需求,以便gulp能按着我们的意愿来执行。

4.gulp的每个模块可以完成不同的任务,所以我们经常要将所需模块require到gulpfile.js这个配置文件中(如果执行任务的时候报错找不到某个模块,只要npm install 这个模块到此目录就可以,不用-g)。比如我们要让gulp为我们压缩js文件:
{
//在gulpfile.js中

var gulp = require ('gulp');
var uglify = require('gulp-uglify');
//新建一个压缩任务(名叫comppress,名字随便起),这个任务的作用是帮我们把写好的script文件夹下的所有.js文件压缩并保存到newScript文件夹下(gulp会自动创建newScript文件夹)。
gulp.task('compress',function(){
    gulp.src('script/*.js')
    .pipe(uglify())
    .pipe(gulp.dest('newScript'))
})

}
然后在命令行,cd到项目目录下,执行:gulp compress
就可以看到目录下生成了newScript文件夹,里面的文件也被压缩了。
5.添加一个watch任务,利用gulp监听script文件夹里所有js文件的改动,一旦改动就执行compress任务
{
//gulpfile.js 添加如下任务

gulp.task('watch',function(){
    gulp.watch('script/*.js',['compress']);
})

}

6.添加default任务(default这个名字不能改),使gulp的默认任务就是watch任务
{
//gulpfile.js
gulp.task('default',['watch']);
}
7.上面的watch任务,一旦script文件夹下游一个文件发生改变,整个文件夹的所有js文件都会被压缩,这影响性能。改写watch任务如下:
{
//gulpfile.js

var watchPath = reqire('gulp-watch-path');
gulp.task('watch',function(){
    // gulp.watch('script/*.js',['firstScript']);
    gulp.watch('script/*.js',function(event){
        var paths = watchPath(event, 'script', 'newScript');
        gulp.src(paths.srcPath)
        .pipe(uglify())
        //paths.distDir为目录文件
        .pipe(gulp.dest(paths.distDir))
    })
})

}

8.给压缩后的文件添加min后缀名
{
//gulpfile.js

//引入重命名模块
var rename = reqiure('gulp-rename')

gulp.task('watch',function(){
    gulp.watch('script/*.js',function(event){
        var paths = watchPath(event, 'script', 'newScript');
        gulp.src(paths.srcPath)
        .pipe(uglify())
        //压缩后添加min后缀名。
        .pipe(rename({suffix: '.min'}))
        .pipe(gulp.dest(paths.distDir))
    })
})

}

點(diǎn)擊查看更多內(nèi)容
40人點(diǎn)贊

若覺(jué)得本文不錯(cuò),就分享一下吧!

評(píng)論

作者其他優(yōu)質(zhì)文章

正在加載中
感謝您的支持,我會(huì)繼續(xù)努力的~
掃碼打賞,你說(shuō)多少就多少
贊賞金額會(huì)直接到老師賬戶(hù)
支付方式
打開(kāi)微信掃一掃,即可進(jìn)行掃碼打賞哦
今天注冊(cè)有機(jī)會(huì)得

100積分直接送

付費(fèi)專(zhuān)欄免費(fèi)學(xué)

大額優(yōu)惠券免費(fèi)領(lǐng)

立即參與 放棄機(jī)會(huì)
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢(xún)優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)

舉報(bào)

0/150
提交
取消