javascript - gulp 构建问题~
本文介绍了javascript - gulp 构建问题~的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
最近学习 gulp ,在一些教程里,总会把:gulp-rev , gulp-rev-replace , gulp-useref 放在一起。
可是在学习中,遇到了很多问题,
左边的是我目录结构,右边的是 gulpfile.js 。
插件依赖什么的都安装好了,只是写法可能有问题。
如上写法运行后,只是 index.html 文件改变了, index 后面加了一串字符。
index.html 这样写应该没有问题的吧?
生成的 index 。 别人的 不都是 main.css 和 main.js 中间加了 一行字符串吗? 为什么我的是 index.html 文件,加了字符串。这样 我的 browser-sync 服务器 就启动不了了啊?
但是怎么写呢?? 求指导~
解决方案
我自己找了资料解决了这个问题,方法如下:
gulp.task("index", function() {
var jsFilter = filter("**/*.js", { restore: true });
var cssFilter = filter("**/*.css", { restore: true });
var indexHtmlFilter = filter(['**/*', '!**/index.html'], { restore: true });
return gulp.src("src/index.html")
.pipe(useref()) // Concatenate with gulp-useref
.pipe(jsFilter)
.pipe(uglify()) // Minify any javascript sources
.pipe(jsFilter.restore)
.pipe(cssFilter)
.pipe(cssmin()) // Minify any CSS sources
.pipe(cssFilter.restore)
.pipe(indexHtmlFilter)
.pipe(rev()) // Rename the concatenated files (but not index.html)
.pipe(indexHtmlFilter.restore)
.pipe(revReplace()) // Substitute in new filenames
.pipe(gulp.dest('dist'));
});
这篇关于javascript - gulp 构建问题~的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文