在前端开发中，我们会经常使用到第三方的npm包来完成一些任务，例如现在我们就要介绍一个可以帮助我们加快前端开发进程的npm包——basy。
什么是basy
basy 是一款用于构建web前端开发工作流的工具，基于 Gulp 构建。它可以帮助我们在开发中自动化一些任务，例如编译 Sass、压缩JS、图片压缩、自动刷新浏览器等。
安装
要使用basy，需要先在本地安装gulp，然后通过npm安装basy。
第一步：安装gulp
npm install gulp -g
第二步：安装basy
npm install basy --save-dev
使用
安装完成后，在项目的根目录下创建一个gulpfile.js文件，然后在里面引入basy:
var gulp = require('gulp');
var basy = require('basy');接下来我们就可以使用basy提供的任务来自动化前端开发的任务了。
编译Sass
我们可以使用basy提供的sass任务来编译Sass文件。在gulpfile.js中添加如下代码：
gulp.task('sass', function () {
return basy.sass('src/sass/**/*.{scss,sass}', 'dist/css');
});这个任务的作用是将src/sass目录下的所有scss或sass文件编译成CSS文件，并将编译后的CSS文件保存到dist/css目录下。
压缩JS
我们可以使用basy提供的uglify任务来压缩JS文件。在gulpfile.js中添加如下代码：
gulp.task('js', function () {
return basy.uglify('src/js/**/*.js', 'dist/js');
});这个任务的作用是将src/js目录下的所有JS文件压缩，并将压缩后的JS文件保存到dist/js目录下。
图片压缩
我们可以使用basy提供的imagemin任务来压缩图片。在gulpfile.js中添加如下代码：
gulp.task('images', function () {
return basy.imagemin('src/images/**/*', 'dist/images');
});这个任务的作用是将src/images目录下的所有图片进行压缩，并将压缩后的图片保存到dist/images目录下。
自动刷新浏览器
我们可以使用basy提供的browserSync任务来自动刷新浏览器。在gulpfile.js中添加如下代码：
-- -------------------- ---- -------
------------------------ ---------- -
------------------------ -
------- -
-------- ------
--
--
---
------------------ -------- ----- --------- --------------- -------- ---
-------------------------------- ----------
---------------------------- --------
----------------------------- ------------
---------------------------- -------------------------
---这个任务的作用是在开发过程中，当我们修改代码时，自动编译Sass、压缩JS、压缩图片，并让浏览器自动刷新以展示最新的效果。
总结
basy为我们提供了一种能够自动化构建我们前端开发工作流的方案，让前端开发变得更加简单高效。我们可以根据自己的需求选择需要使用的任务，整合成一个完整的工作流，以便能够更好地提高我们的开发效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055fda81e8991b448dd6c9