1、gulp安裝

需要全局安裝：npm install gulp -g

還需要本地安裝,在項目目錄中：npm install gulp --save

2、gulp使用

• 在項目目錄中新建1個gulpfile.js文件.

• 在這個文件中寫上構建代碼.

gulp-uglify 壓縮js

壓縮混淆js代碼,需要gulp-uglify插件支持.使用npm安裝該插件? npm install?gulp-uglify

// 獲取 gulp var gulp = require('gulp'); // 獲取 uglify 模塊（用于壓縮 JS） var uglify = require('gulp-uglify'); // 壓縮 js 文件 // 在命令行使用 gulp script 啟動此任務 gulp.task('jscompress', function() {// 1. 找到文件return gulp.src('js/cart.js')// 2. 壓縮文件.pipe(uglify({mangle:true}))// 3. 另存壓縮后的文件.pipe(gulp.dest('dist/js')); });

　　

壓縮CSS?

需要gulp-cssmin插件支持.使用npm安裝該插件? npm install?gulp-cssmin

var cssmin = require("gulp-cssmin");gulp.task("csscompress",function () {//1.這個任務是用來壓縮css的.// 那么首先你需要指定需要壓縮的css文件// 調用gulp對象的src方法,指定要處理的文件的路徑.gulp.src("css/ershou.css").pipe(cssmin()).pipe(gulp.dest("dist/css"));//2.pipe()管道理解 閥門形象理解.//3.管道中每一個閥門做不同的事情.不同的事情需要插件來完成.// 壓縮css的插件. gulp-cssmin// 安裝插件,引入gulp-cssmin// 引入后,其實1個函數.// 將其在管道中調用,相當于在管道中設置了1個閥門.//4.管道最后1關,要調用gulp對象的dest方法,設置存放處理后的路徑.});

?

執行命令：

gulp csscompressgulp jscompress

　　

?

轉載于:https://www.cnblogs.com/winstonsias/p/11572285.html

總結

以上是生活随笔為你收集整理的gulp 项目构建 代码压缩与混淆的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。