gulp-uglify 压缩javascript文件

1、安装gulp-uglify

命令行输入npm install gulp-uglify --save-dev ;

2、配置文件

2.1基本使用

var gulp = require(‘gulp‘),  
    uglify = require(‘gulp-uglify‘);  //获取uglify插件

gulp.task(‘jsmin‘, function () {
    gulp.src(‘src/js/index.js‘)     //引入js文件
        .pipe(uglify())
        .pipe(gulp.dest(‘dist/js‘));
});

2.2压缩多个JS文件

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

gulp.task(‘jsmin‘, function () {
    gulp.src([‘src/js/index.js‘,‘src/js/detail.js‘]) //多个文件以数组形式传入
        .pipe(uglify())
        .pipe(gulp.dest(‘dist/js‘));
});

3、执行任务

命令行输入:gulp jsmin  

时间: 2024-11-11 22:48:42

gulp-uglify 压缩javascript文件的相关文章

压缩javascript文件方法

写在前面的话:正式部署前端的时候,javascript文件一般需要压缩,并生成相应的sourcemap文件,对于一些小型的项目开发,这里提供一个简单的办法. ======正文开始====== 1.下载google-closure-compiler文件: 从这里下载:download 2.复制压缩包中的compiler.jar到需要压缩的javascript文件目录. 3.打开命令行cmd,cd到该目录,运行如下命令: java -jar compiler.jar --js test.js --j

webstorm 设置uglify 压缩js文件

第一步:打开npm,全局安装 npm install uglify-js -g 第二步: 打开webstorm的file->settings ->External Tools,点击左上角的"加号"标志add,进入对话框   第三步:在webstorm中的命令行,切换到要压缩的文件目录,输入命令 uglifyjs xxxx.js -o xxxx-min.js 成功!

使用gulp 合并压缩打包,实时监控文件,实现本地server

今天不讲webpack,就说说gulp是怎么进行压缩合并打包 首先你的安装gulp : npm install gulp -g --save-dev 然后最基本的你因该知道gulp 的四个方法, gulp.src:读取文件 gulp.pipe:将文件流输入到指定的文件目录 gulp.task:建立gulp任务,例如合并,压缩,清除文件, gulp.watch:用于监听文件的变化 关于其他的嘛,那就是gulp 之所以那么强大,原因就是他有很多插件,我们要完成一些功能就必须要学会使用一些插件 1)在

gulp插件实现压缩一个文件夹下不同目录下的js文件(支持es6)

gulp-uglify:压缩js大小,只支持es5 安装: cnpm: cnpm i gulp-uglify -D yarn: yarn add gulp-uglify -D 使用: 代码实现1:压缩js文件夹下的index.js文件输出到dist文件夹下面(注意要压缩的js文件中此处只能使用es5) 1 var gulp = require('gulp'); 2 var uglify = require('gulp-uglify'); 3 4 gulp.task("uglify",f

Spring Mvc + Maven + yuicompressor 使用 profile 来压缩 javascript ,css 文件; (十)

profile相关知识点: 在开发项目时,设想有以下场景: 你的Maven项目存放在一个远程代码库中(比如github),该项目需要访问数据库,你有两台电脑,一台是Linux,一台是Mac OS X,你希望在两台电脑上都能做项目开发.但是,安装Linux的电脑上安装的是MySQL数据库,而Mac OS X的电脑安装的是PostgreSQL数据库.此时你需要找到一种简单的方法在两种数据库连接中进行切换,你会怎么做? 此外,你的项目需要部署.为了调试,在开发时我们在Java编译结果中加入了调试信息(

如何使用grunt压缩js文件

jQuery在使用grunt,bootstrap在使用grunt,百度UEditor在使用grunt,你没有理由不学.不用! 1. 前言 各位web前端开发人员,如果你现在还不知道grunt或者听说过.但是不会熟练使用grunt,那你就真的真的真的out了(三个“真的”重复,表 示重点).至于grunt的作用,这里不详细说了,总之你如果做web前端开发,你一定要用grunt.还有一点,它完全免费,没有盗版.既强大又免费的 东西,为何不用? 当然了,你如果你能找到更好的替代grunt的其他工具也是

利用Node 搭配uglify-js压缩js文件,批量下载图片到本地

Node的便民技巧-- 压缩代码 下载图片 压缩代码 相信很多前端的同学都会在上线前压缩JS代码,现在的Gulp Webpack Grunt......都能轻松实现.但问题来了,这些都不会,难道就要面对几十个JS文件一遍遍来回“复制-压缩-创建-粘贴”,这样太不人性化了. 于是可以借助Node + uglify-js 轻松实现.(前提你会点node操作) 1.首先看一下目录: |--uglifyJS |--js |--test1.js |--test2.js |--uglify.js   //这

gulp自动化压缩合并、加版本号解决方案

虽然网上有很多的 gulp 构建文章,但是很多都已经随着 gulp 插件的更新无法运行了.因此,我写了这个比较简单的构建方案. 如果还不熟悉 gulp 的插件,可以阅读上一篇文章:精通gulp常用插件 这个方案主要是为了实现js/css的压缩合并.自动添加版本号和压缩html. gulp-csso 压缩优化css gulp-uglify 压缩js gulp-html-minify 压缩html gulp-rev-all 生成版本号 主要通过上面插件实现功能,其他插件配合使用. // gulpfi

关于gulp的压缩js和css

npm install --global gulp npm install gulp --save-dev 在项目根目录下创建一个名为 gulpfile.js 的文件 var gulp = require('gulp'); gulp.task('default', function() {  // 将你的默认的任务代码放在这}); npm install  gulp-minify-css gulp-jshint gulp-uglify gulp-rename gulp-concat gulp-c