Gulp 是一款基于 Node.js 的自動(dòng)化構(gòu)建工具，它主要用于提高開發(fā)效率，可以在項(xiàng)目中自動(dòng)化執(zhí)行諸如編譯、壓縮、打包等重復(fù)性的操作。本文將介紹如何使用 Gulp 來壓縮 CSS 和 JS 文件。

首先，我們需要安裝 gulp 和相應(yīng)的插件。在命令行中輸入以下命令：

npm install gulp gulp-uglify gulp-csso --save-dev

其中，gulp-uglify用于壓縮 JS 文件，gulp-csso用于壓縮 CSS 文件。

下面是一個(gè) Gulp 任務(wù)的示例代碼：

const gulp = require('gulp');
const uglify = require('gulp-uglify');
const csso = require('gulp-csso');
gulp.task('minify-js', function() {
return gulp.src('./src/js/*.js')
.pipe(uglify())
.pipe(gulp.dest('./dist/js'));
});
gulp.task('minify-css', function() {
return gulp.src('./src/css/*.css')
.pipe(csso())
.pipe(gulp.dest('./dist/css'));
});
gulp.task('default', [
'minify-js',
'minify-css'
]);

上面的代碼定義了兩個(gè)任務(wù)，minify-js用于壓縮 JS 文件，minify-css用于壓縮 CSS 文件。這兩個(gè)任務(wù)會(huì)分別讀取src/js和src/css目錄中的文件，經(jīng)過壓縮后輸出到dist/js和dist/css目錄中。

在命令行中輸入gulp命令即可執(zhí)行默認(rèn)的任務(wù)。

gulp

執(zhí)行成功后，我們可以在dist/js和dist/css目錄中看到壓縮后的文件。

以上就是使用 Gulp 壓縮 CSS 和 JS 文件的簡(jiǎn)單介紹，希望能幫助您提高開發(fā)效率。