这次给大家带来怎样使用gulp自动优化requirejs的项目，使用gulp自动优化requirejs的项目的注意事项有哪些，下面就是实战案例，一起来看一下。
{
"name": "gulp-requiredemo",
"version": "0.0.0",
"scripts": {
"test": "echo \"error: no test specified\" && exit 1"
},
"author": "feier",
"license": "isc",
"dependencies": {
"amd-optimize": "^0.4.3", //关键文件 与gulp与require集成
"gulp": "^3.8.10", //gulp主文件
"gulp-concat": "^2.4.2", //文件合并
"gulp-imagemin": "^2.0.0", //图片压缩
"gulp-jshint": "^1.9.0",//js检查
"gulp-less": "^2.0.1", //less编译
"gulp-minify-css": "^0.3.11",//css压缩
"gulp-rename": "^1.2.0",//重命名
"gulp-uglify": "^1.0.2",//文件压缩
"imagemin-pngcrush": "^4.0.0"
},
"main": "index.js",
"directories": {
"test": "test"
},
}
gulpfile.js文件
//引入gulp
var gulp = require('gulp');
//引入组件
var concat = require('gulp-concat');//合并
var jshint = require('gulp-jshint'); //js规范验证
var uglify = require('gulp-uglify');//压缩
var rename = require('gulp-rename'); //文件名命名
var amdoptimize = require("amd-optimize"); //require优化
var watch = require('gulp-watch');
//脚本检查 gulp.task('lint', function () {
gulp.src('./src/js/**/*.js')
.pipe(jshint())
.pipe(jshint.reporter('default'));
});
//require合并
gulp.task('rjs', function () {
gulp.src('./src/js/**/*.js')
.pipe(amdoptimize("main", { //require config
paths: {
"jquery": "../../libs/jquery/dist/jquery.min",
"jquery.serializejson": "../../libs/jquery.serializejson/jquery.serializejson.min",
"sug": "src/js/suggestion/suggestion",
"validate": "../util/src/js/util/validate",
"urlparam": "../util/src/js/util/url.param"
},
shim: {
"jquery.serializejson": ['jquery']
}
}))
.pipe(concat("index.js")) //合并
.pipe(gulp.dest("dist/js")) //输出保存
.pipe(rename("index.min.js")) //重命名
.pipe(uglify()) //压缩
.pipe(gulp.dest("dist/js")); //输出保存 });
gulp.task('default', function () {
//监听js变化
gulp.watch('./src/js/**/*.js', function () { //当js文件变化后，自动检验 压缩
//gulp.run('lint', 'scripts');
gulp.run('lint', 'rjs');
});
});
相信看了本文案例你已经掌握了方法，更多精彩请关注其它相关文章！
相关阅读：
怎样设置默认打开360极速模式
怎样让vue es6解析为es5语法
以上就是怎样使用gulp自动优化requirejs的项目的详细内容。