前言
gulp-cleancss 是一个用来压缩和优化 CSS 的 NPM 包，其作用是清理和优化 CSS 代码，减小文件大小，提高加载速度。如果你经常使用 gulp 和 CSS，那么这个包会很有用。
安装
在开始使用 gulp-cleancss 之前，你需要确保你已经成功安装了 Node.js 和 gulp。
如果你还没有安装 gulp-cleancss，可以使用以下命令进行安装：
--- ------- ---------- -------------
使用方法
在使用 gulp-cleancss 进行 CSS 优化前，你需要使用 gulp 来加载该模块。以下是一段示例代码：
----- ---- - ----------------
----- -------- - -------------------------
----------------------- -- -- -
------ ---------------------
-----------------
-------------------------
---以上代码定义了一个名为 minify-css 的 gulp 任务，它使用 gulp-cleancss 来压缩和优化存储在 src 文件夹中的 CSS 文件，并将它们输出到 dist 文件夹中。
配置选项
gulp-cleancss 支持多种配置选项，这些选项可以帮助你根据自己的需求进行优化。
compatibility
compatibility 选项指定了要兼容的浏览器版本。你可以使用如下命令进行设置：
----------------------- -- -- -
------ ---------------------
---------------- -------------- ----- ---
-------------------------
---以上代码使用了 ie8 的兼容模式，表示支持 Internet Explorer 8 及以上版本。如果你需要支持其他浏览器，可以在选项中设置对应的浏览器版本。
level
level 选项指定了优化的级别。级别分为 0 到 2，数字越大，优化的程度就越高。默认值为 1。
以下是一个示例：
----------------------- -- -- -
------ ---------------------
---------------- ------ - ---
-------------------------
---以上代码指定了 level 选项为 2，表示使用最高的优化级别进行优化。
format
format 选项指定了输出样式的格式。默认情况下，gulp-cleancss 会使用 CSS 文件格式进行输出。你可以使用以下命令进行设置：
----------------------- -- -- -
------ ---------------------
---------------- ------- ---------- ---
-------------------------
---以上代码指定了 format 选项为 beautify，表示进行美化输出。
总结
gulp-cleancss 是一个非常实用的 NPM 包，它可以帮助我们提高网站页面的加载速度，减少文件大小。通过以上的介绍，相信您已经能够在自己的项目中使用 gulp-cleancss 进行 CSS 优化了。在进行使用时需要注意配置选项，以确保您的 CSS 文件得到最佳的优化效果。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/5eedaf59b5cbfe1ea0610fee