@alexistessier/gulp-workflow-common-task 是一个适用于前端项目的 Gulp 工作流常用任务的 npm 包。本文将介绍 npm 包的基本使用方法、注意事项以及示例代码，帮助读者更迅速地掌握。
安装
在项目根目录下，使用 npm 命令安装 @alexistessier/gulp-workflow-common-task ：
npm install @alexistessier/gulp-workflow-common-task --save-dev
在全局安装 Gulp：
npm install gulp -g
安装完成后，即可在项目中使用 @alexistessier/gulp-workflow-common-task 插件。
使用方法
- 在项目根目录下，创建一个
config目录 - 在
config目录下创建一个gulpfile.common.js文件 - 在
gulpfile.common.js中按配置要求配置任务 - 在项目根目录下，创建一个
gulpfile.js文件 - 在
gulpfile.js中引入@alexistessier/gulp-workflow-common-task插件，并传入与gulpfile.common.js中相同的配置信息 - 运行 Gulp 任务
注意事项
gulpfile.common.js中必须导出一个对象，并配置src、dest等常用任务。其中，src为要操作的源文件，dest为生成的目标文件。gulpfile.js中必须按gulpfile.common.js中配置的任务名依次调用插件。@alexistessier/gulp-workflow-common-task插件中已经预设了一些常用任务。如果你想要使用更多任务，请在gulpfile.common.js中按配置要求添加。- 本插件与 Gulp 版本兼容性为 4.0 及以上版本，请确保使用正确的 Gulp 版本。
示例代码
gulpfile.common.js 中的示例代码：
-- -------------------- ---- -------
----- ---- - ----------------
----- ------ - -----------------------
----- ------ - -----------------------
-------------- - -
--- ---- ----- -- --
-------------- -- -- -
------ -----------------------
-----------------------
------------------------
---------------
---------------------------
-------------------------
--
--- ----------- --
---------------- -- -- -
------ -------------------------
-------------------------------
-
--gulpfile.js 中的示例代码：
-- -------------------- ---- ------- ----- ---- - ---------------- ----- --------------- - ---------------------------------------------------- ----- ------------------ - - ---- ------ ----- ------- ---------------- - ------------------ -- ------------ ----- ----------- ---- -- ------------ - ------------ ------------ -- ----- ----- ------------- -------------- -- --------------------- -------------------- -------------------- ----------------------
以上的示例代码中，我们例举了两个任务：单元测试 build 任务、复制静态资源到开发目录。这里只是简单的列举，实际上该 npm 包支持很多常用任务的配置，如压缩 CSS、HTML、JS 等文件，启动本地服务等。读者可以根据实际需求配置。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/112613