什么是 island-build
island-build 是一个基于 gulp 的自动化构建工具，主要用于前端项目的编译和打包，支持 TypeScript、Less、ES6 等等开发语言。使用 island-build 可以极大地提高前端项目的开发效率和质量。
安装和使用
安装
全局安装命令：
npm install -g island-build
安装后就可以在任何地方使用 island-build 命令了。
使用
使用前需要先准备好项目目录：
project ├─ src │ ├─ js │ ├─ css │ ├─ images │ └─ index.html └─ dist
在项目根目录下创建 gulpfile.js 文件：
-- -------------------- ---- ------- ----- ---- - ---------------- ----- ------ - ------------------------ -------------------- -- -- - ------ ---- ------------------ --------------- --------------------------- ---展开代码
然后在命令行中执行以下命令：
gulp这样就可以将 src 目录中的所有文件编译打包到 dist 目录下了。
功能介绍
支持 JavaScript
在项目中使用 TypeScript 或者 ES6 都可以。当然，island-build 也支持 css、less 等编译。
-- -------------------- ---- ------- ------ ----- ---- -------- ----- --- ------- --------------- - -------- - ------ --------- ------------ - - -------------------- --- ---------------------------------展开代码
支持样式编译
island-build 支持 css 和 less 样式编译，并且可以自动为样式添加浏览器前缀，避免兼容问题。
-- -------------------- ---- ------- -- ---------- --------------- -------- ------- - ------ --------------- ----------- ------ ------- --- ----- --------------- -展开代码
支持图像压缩
在项目中使用的图片资源，为了加快加载速度建议进行压缩。island-build 可以帮助你自动将图片进行压缩，提高页面加载速度。
<img src="images/logo.png">
支持 HTML 压缩
在项目发布之前通常会对 html 代码进行压缩，可以减少文件大小，加快加载速度。
-- -------------------- ---- ------- --------- ----- ------ ------ ------------ ------------- ------- ------ --------- ---------- ------- -------展开代码
自定义任务
island-build 还支持自定义任务。例如，在项目中需要打包的时候还需要把某个文件夹放到其他位置。可以使用自定义任务来处理。
-- -------------------- ---- ------- ----- ---- - ---------------- ----- ------ - ------------------------ ----------------- -- -- - ------ ----------------------------------------------------- --- -------------------- ------------------- -- -- - ------ ---- ------------------ --------------- --------------------------- ----展开代码
小结
island-build 是一个非常实用的自动化构建工具，可以帮助你快速打包前端项目，并且支持自定义任务。在项目开发过程中，使用 island-build 可以提高开发效率和质量，是前端开发必备的工具之一。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/197108
