在前端开发中，CSS 是不可或缺的一部分。然而，由于 CSS 代码的复杂性和重复性，我们常常需要使用一些工具来优化代码。而 gobble-clean-css 正是这样一个工具。
什么是 gobble-clean-css
gobble-clean-css 是一款基于 Node.js 平台的 CSS 代码压缩工具，可以帮助我们优化 CSS 代码，减少文件大小，提高网页加载速度。它使用的是 clean-css，一个流行的 CSS 代码压缩工具。
安装和使用
安装 gobble-clean-css 只需要在命令行中执行以下命令：
npm install gobble-clean-css --save-dev
安装完成后，在项目中添加以下代码即可使用它：
-- -------------------- ---- ------- ----- ------ - ------------------ ----- -------- - ---------------------------- ----- -------- - ---------- ----- --------- - ----------- -------------- - ---------------- ---------------------- -------------------
这段代码做了什么呢？它将 'src/css' 目录下的所有 CSS 文件进行压缩，然后将它们放到 'dist/css' 目录下，供我们进行使用。
配置参数
除了默认配置外，gobble-clean-css 还有一些可配置的参数，我们可以根据项目的实际情况进行修改。下面是一些常用的参数：
- compatibility：指定要向后兼容到哪个版本的浏览器。默认兼容 IE 10+ 和所有现代浏览器。
- level：指定 CSS 压缩的级别。可以是 0、1 或 2。默认为 1。
- format：指定生成的 CSS 代码格式。可以是 'keep-breaks'、'keep-all'、'keep-indentation' 或自定义格式。
下面是一个例子：
-- -------------------- ---- -------
----- ------ - ------------------
----- -------- - ----------------------------
----- -------- - ----------
----- --------- - -----------
-------------- - ----------------
---------------------
-------------- ------
------ --
------- -
---------- -----
--------- --
------- -
------------------ -----
------------ ----
-
-
---
-------------------总结
通过使用 gobble-clean-css，我们可以轻松地压缩 CSS 代码，提高网页加载速度。它具有简单易用的 API 和丰富的配置选项，可以满足不同项目的需求。我们在项目中应该认真选择合适的 CSS 压缩工具，并根据实际情况进行配置，以达到最佳的优化效果。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066e6e255dee6beeee73e9