使用gulp-uglify压缩js文件

最新推荐文章于 2024-08-31 08:42:55 发布

kongjunchao159

最新推荐文章于 2024-08-31 08:42:55 发布

阅读量7.9k

点赞数

CC 4.0 BY-SA版权

分类专栏： gulp

本文链接：https://blog.youkuaiyun.com/kongjunchao159/article/details/51861436

gulp 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了如何通过全局安装gulp和项目内安装gulp-uglify来实现JavaScript文件的压缩。首先，需要在命令行中进行全局和项目内的npm安装，然后在项目根目录创建gulpfile.js，并编写相关配置代码。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、全局安装gulp

npm install -g gulp

2、项目下安装gulp和gulp-uglify

cmd切换到项目目录，执行npm install gulp和npm install gulp-uglify

3、安装完毕后，项目的gulp文件夹下，新增文件gulpfile.js（注意该文件名不可更改），并在gulpfile.js文件中写入如下代码

var gulp = require('gulp'),
    uglify = require('gulp-uglify');

gulp.task('default', function(){
    gulp.src('src/app.js')<span style="white-space:pre">	</span>//需要压缩的JS文件的路径，全部可用*.js，也可传入数组形式的参数来压缩多个文件
        .pipe(uglify())
        .pipe(gulp.dest('dist/'));<span style="white-space:pre">	</span>//压缩完毕后，JS文件的保存路径
});

也可以在.pipe(uglify())中传入参数来配置压缩方式

var gulp = require('gulp'),
    uglify= require('gulp-uglify');
 
gulp.task('jsmin', function () {
    gulp.src(['src/js/*.js', '!src/js/**/{test1,test2}.js'])
        .pipe(uglify({
            //mangle: true,//类型：Boolean 默认：true 是否修改变量名
            mangle: {except: ['require' ,'exports' ,'module' ,'$']}//排除混淆关键字
        }))
        .pipe(gulp.dest('dist/js'));
});

var gulp = require('gulp'),
    uglify= require('gulp-uglify');
 
gulp.task('jsmin', function () {
    gulp.src(['src/js/*.js', '!src/js/**/{test1,test2}.js'])
        .pipe(uglify({
            mangle: true,//类型：Boolean 默认：true 是否修改变量名
            compress: true,//类型：Boolean 默认：true 是否完全压缩
            preserveComments: 'all' //保留所有注释
        }))
        .pipe(gulp.dest('dist/js'));
});

4、最后，cmd切换到该项目的gulp目录下执行gulp jsmin即可（gulp + task名，如果为default，直接执行gulp即可）

参考链接：

http://www.ydcss.com/archives/54