我尝试使用Gulp来:
1.取3个特定的javascript文件,将它们连接起来,然后将结果保存到一个文件(concat.js)中
1.获取此连接文件并对其进行丑化/缩小,然后将结果保存到另一个文件(uglify.js)
到目前为止,我有以下代码
var gulp = require('gulp'),
gp_concat = require('gulp-concat'),
gp_uglify = require('gulp-uglify');
gulp.task('js-fef', function(){
return gulp.src(['file1.js', 'file2.js', 'file3.js'])
.pipe(gp_concat('concat.js'))
.pipe(gp_uglify())
.pipe(gulp.dest('js'));
});
gulp.task('default', ['js-fef'], function(){});
但是,丑化操作似乎不起作用,或者由于某种原因没有生成文件。
我需要做些什么才能做到这一点?
6条答案
按热度按时间t3irkdon1#
结果是我需要使用
gulp-rename
,并且在'uglification'之前首先输出连接的文件。来自X1 M1 N1 X,一开始有点混乱,但现在有意义了。我希望它能帮助X1 M2 N1 X新手。
如果您需要源代码Map,下面是更新后的代码:
请参阅gulp-sourcemaps了解有关选项和配置的更多信息。
更新-2022年2月
现在,使用Gulp 4和Async/Await功能处理构建任务可能会更容易:
然后从CLI执行以下操作:
gzjq41n42#
我的gulp文件生成了一个最终的compiled-bundle-min.js,希望这能对大家有所帮助。
taor4pac3#
使用
gulp-uglify
、gulp-concat
和gulp-sourcemaps
的解决方案。这是我正在做的一个项目。这将合并并压缩所有的
scripts
,将它们放入一个名为all_the_things.js
的文件中。它告诉您的浏览器查找该Map文件,并写出该文件。
yv5phkfx4#
您解决方案不起作用,因为您需要在concat过程后保存文件,然后进行uglify并再次保存在concat和uglify之间不需要重命名文件
oug3syen5#
**2015年6月10日:**来自
gulp-uglifyjs
作者的注解:**已弃用:**此插件已被列入黑名单,因为它依赖Uglify来连接文件,而不是使用gulp-concat,这打破了“它应该做一件事”的范式。当我创建此插件时,没有办法让源Map与gulp一起工作,但是现在有一个gulp-sourcemaps插件可以实现同样的目标。gulp-uglifyjs仍然工作得很好,并对Uglify的执行提供了非常精细的控制,我只是提醒你现在还有其他选项。
2015年2月18日:
gulp-uglify
和gulp-concat
现在都可以很好地与gulp-sourcemaps
配合使用。只需确保为gulp-concat
正确设置newLine
选项;我推荐\n;
。**原始答案(2014年12月):**使用gulp-uglifyjs代替。
gulp-concat
不一定安全;gulp-uglify
也不支持源代码Map。下面是我正在做的一个项目的代码片段:bhmjp9jg6#
我们正在使用以下配置执行类似操作
GulpDS文件示例如下: