gulp useref 合并js

1、安装插件

npm install gulp-useref --save-dev

2、引用js

var useref = require('gulp-useref');

3、index.html js引用修改如下

<!--build:js js/main.min.js -->
<script src="js/a.js"></script>
<script src="js/b.js"></script>
<script src="js/main.js"></script>
<!-- endbuild -->

js/a.js

function add(a, b){
    console.log(a + b);
}

js/b.js

function mul(a, b){
    console.log(a * b);
}

main.js

add(1, 2);
mul(9, 9);

 

4、创建合并js任务

gulp.task('useref', function(){
    return gulp.src('app/*.html')
        .pipe(useref())
        .pipe(gulp.dest('app/dist')); // 生成的文件将存储在 app/dist/js/main.min.js
});

5、执行useref任务

gulp useref

生成的合并文件

function add(a, b){
    console.log(a + b);
}
function mul(a, b){
    console.log(a * b);
}
add(1, 2);
mul(9, 9);

 

发表评论