缩小 CSS
缩小或 压缩是指在不改变源代码功能的前提下，移除所有不必要的字符，例如空格、换行、注释。 在开发和调试期间，这些字符使代码更易于阅读。 在生产阶段，这些字符只会增加需要传输的代码大小。
通常，压缩作为构建过程中的一个步骤执行，可使用诸如 webpack 之类的工具。 如果您不使用构建工具，可以使用独立工具，例如 CSSO 或 cssnano。
要自动缩小您的代码，您需要安装一个缩小工具，并配置一个 文件监视器 ，用于跟踪文件的更改并运行缩小工具。
默认情况下，一旦 文件监视器 作用域中的 CSS 文件发生更改并保存，缩小就会开始。 您可以指定其他 触发该工具的事件。 了解详情，请参阅 文件监视器。
生成的缩小后的代码将保存在与源 CSS 文件同名且扩展名为 min.css 的单独文件中。 该生成文件的位置在 新建监视器对话框 的 要刷新的输出路径 字段中定义。 但是，在 项目树 中，包含缩小后代码的文件会显示在以节点形式显示的源 CSS 文件下方。 要更改此默认显示方式，请在 项目 工具窗口 Alt+1 中 配置文件嵌套。
下面的示例展示如何使用 CSSO 直接在 PyCharm 中缩小您的 CSS 代码。
示例：使用 CSSO 压缩 CSS
要自动缩小您的代码，您需要安装 CSSO，并配置一个 CSSO 文件监视器 ，用于跟踪文件的更改并运行该工具。
默认情况下，一旦文件监视器作用域中的 CSS 文件发生更改并保存，缩小就会开始。 您可以指定其他 触发 CSSO 的事件。 了解详情，请参阅 文件监视器。
生成的缩小后的代码将保存在与源 CSS 文件同名且扩展名为 min.css 的单独文件中。 该生成文件的位置在 新建监视器对话框 的 要刷新的输出路径 字段中定义。 但是，在 项目树 中，包含缩小后代码的文件会显示在以节点形式显示的源 CSS 文件下方。 要更改此默认显示方式，请在 项目 工具窗口 Alt+1 中 配置文件嵌套。
开始之前
全局安装 csso-cli
在内置的 终端 （Alt+F12 ）中，键入：
npm install -g csso-cli
创建 CSSO 文件监视器
在 设置 对话框（Ctrl+Alt+S ）中，点击 工具 下的 文件监视器。 打开的 文件监视器页面 会显示已配置的文件监视器列表。
点击
或按 Alt+Insert ，然后在列表中选择 CSSO CSS Optimizer 预定义模板。
将打开 新建监视器 对话框。
在 程序 字段中，指定
csso可执行文件的位置。如果您通过 Node 包管理器 安装了
csso-cli， PyCharm 会自动定位该软件包，并使用csso别名自动填写该字段。否则，请手动键入路径，或点击
，然后在打开的对话框中选择文件位置。接受默认的 File Watcher 设置或根据需要重新进行配置，如 文件监视器 中所述。
在此示例中，默认值如下：
-i $FileName$ -o $FileNameWithoutExtension$.min.css在 参数 字段中。$FileNameWithoutExtension$.min.css在 要刷新的输出路径 字段中。$FileDir$在 工作目录 字段中。
点击 确定 以返回到 文件监视器 页面，在该页面中，已将新建的文件监视器添加到列表中：
请确保选中 启用 复选框。
默认情况下，文件监视器将在当前项目中可用。 要在其他项目中使用它，请在 级别 列表中选择 全局。