引言
前端开发离不开构建工具，其中 Gulp 是被广泛应用的一种构建工具，它能够简化前端项目的构建流程，提高开发效率。shimo-gulp-build 是一款基于 Gulp 的构建工具，用于开发实现十分方便，本文将为大家详细介绍 shimo-gulp-build 包的使用与相关知识。
说明
shimo-gulp-build 是一款的基于 Gulp 的前端构建工具，它为我们提供了一系列的自动化任务，并将其优化、整合和封装，为前端工程师提供了非常方便的使用方式。
安装和使用
步骤：
创建一个空的目录，cd 到这个文件夹下。
执行以下命令：
npm install --save-dev shimo-gulp-build
- 将以下代码添加到你的 Gulpfile.js 文件
-- -------------------- ---- ------- ----- ---- - ---------------- ----- ----- - ---------------------------- ----- ------- - - -- ---------------- ----- ------- -------- -------- --------- ----- - ------- ---- - -- ------------------ -- -- - ------ ----------- ----------- ---
以上代码含义是：
- 首先引用 gulp 和 shimo-gulp-build；
- 在 shimo-gulp-build 中设置以上选项；
- 创建一个 Gulp 任务并调用 shimo-gulp-build 函数。
- 运行构建：
gulp build
- 运行后就可以看到输出的目录 destDir 中生成了编译后的文件。
配置
配置主要是传递给 shimo-gulp-build 的选项，以下是配置选项列表：
-- -------------------- ---- -------
----- ------- - -
------- --------
-------- ---------
--- -
------- ----- -- --------- ----------
------ --
--
----------- -
------- -----
--------- -- -- ---------- ---
--
----- -
------- -----
----- --- -- ---- ---
------------- -
------- ----
-
--
---- -
------- -----
------------- -
------- ----
--
------- -
------- -----
---- --
-
--
----- -
------- -----
--------- ---
------- -
------- -----
--- --
--
--------- -
------- -----
--------- -
--------- -
-------- ----- ----
-
-
-
--
----- -
-----------------------
------------
--
------ -------------- --------
--可选项含义：
- srcDir：源目录，即被处理的文件所在的目录，默认目录为 ./app。
- destDir：目标目录，处理后的文件将会存储到该目录中，默认目录为 ./dist。
- js：JavaScript 编译选项，用于在 JavaScript 文件被最终合并之前执行一遍 Babel 编译。（默认为开启）
- typescript：TypeScript 编译选项，用于在 TypeScript 文件被最终合并之前编译 TypeScript 代码。（默认为开启）
- less：LESS 编译选项，用于编译 LESS 文件。（默认为开启）
- css：CSS 编译选项，用于将 CSS 文件进行压缩、组合和添加浏览器厂商前缀。
- html：HTML 编译选项，用于提取本地 HTML 文件中的 压缩代码并进行图片压缩和文件路径替换。
- copy：拷贝指定格式的文件。
- clean：清理指定的文件。
注：以上的选项均可以以默认的方式进行使用，也可以通过对应的设置进行自定义配置。
结语
通过使用 shimo-gulp-build，我们可以轻松实现前端项目的构建和优化，大大提高了开发效率。本文介绍的只是 shimo-gulp-build 的部分内容，读者在使用 shimo-gulp-build 时可以查看 shimo-gulp-build 的文档，相信你会有更加深入的了解。
示例代码
-- -------------------- ---- -------
----- ---- - ----------------
----- ----- - ----------------------------
----- ------- - -
------- --------
-------- ---------
--- -
------- -----
------ --
--
----------- -
------- -----
--------- --
--
----- -
------- -----
----- ---
------------- -
------- ----
-
--
---- -
------- -----
------------- -
------- ----
--
------- -
------- -----
---- --
-
--
----- -
------- -----
--------- ---
------- -
------- -----
--- --
--
--------- -
------- -----
--------- -
--------- -
-------- ----- ----
-
-
-
--
----- -
-----------------------
------------
--
------ -------------- --------
--
------------------ -- -- -
------ ----------- -----------
---来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/158685