animate.css 的构建系统是一个基于 PostCSS 的管道，负责将源 CSS 文件转换为具有适当浏览器兼容性和优化的各种输出格式。本文档涵盖了构建架构、可用脚本、配置选项以及如何创建自定义构建。
有关自定义构建的创建和定制详细信息，请参阅 自定义构建。
animate.css 构建系统使用 PostCSS 和多个插件来处理和优化，将源文件转换为三种不同的输出格式。
来源：package.json18-30 postcss.config.js17-46
构建过程通过 package.json 文件中定义的 npm 脚本进行控制。这些脚本处理不同的构建目标和附加任务。
| 脚本 | 描述 | 命令 |
|---|---|---|
start | 运行所有构建格式（原始、生产、兼容） | npm-run-all raw prod compat |
raw | 创建未压缩的开发版本 | npx postcss source/animate.css -o animate.css --no-map --env development |
dev | 带监视模式的开发构建 | npx postcss source/animate.css -o animate.css --no-map --env development -w |
prod | 创建压缩的生产版本 | npx postcss source/animate.css -o animate.min.css --no-map --env production |
compat | 创建不带前缀的兼容版本 | npx postcss source/animate.css -o animate.compat.css --no-map --env compat |
docs:library | 为文档网站构建 CSS | npx postcss source/animate.css -o ./docs/animate.min.css --no-map --env production |
docs | 构建库和文档 | npm-run-all docs:library docs:pages |
构建系统利用一系列 PostCSS 插件来处理和转换 CSS。每个插件在管道中都有特定作用。
| 插件 | 目的 |
|---|---|
postcss-import | 将 @import 规则内联为实际的 CSS 内容 |
postcss-prefixer | 将配置的前缀添加到动画类名 |
postcss-preset-env | 添加浏览器兼容性功能和自动前缀 |
cssnano | 优化和压缩 CSS（仅限生产/兼容构建） |
postcss-header | 将许可证和版本信息添加到输出文件顶部 |
构建系统的行为可以通过 package.json 文件中的配置选项进行自定义。
动画类的前缀（默认是 animate__）可以通过 package.json 中的 animateConfig.prefix 属性进行配置。
来源：package.json15-17 postcss.config.js18 postcss.config.js28-31
构建过程的行为根据传递给 PostCSS 的环境标志而变化
| 环境 | 前缀行为 | 代码压缩 | 输出 |
|---|---|---|---|
development (开发) | 添加配置的前缀 | 不进行压缩 | animate.css |
production (生产) | 添加配置的前缀 | 经过 cssnano 压缩 | animate.min.css |
compat | 不添加前缀 | 经过 cssnano 压缩 | animate.compat.css |
来源：postcss.config.js18-19 postcss.config.js40
构建系统生成三个不同的输出文件，每个文件都有特定的用途。
来源：package.json20-22 docsSource/sections/07-custom-builds.md15-19
animate.css (开发构建)
animate.min.css (生产构建)
animate.compat.css (兼容构建)
.bounce 而不是 .animate__bounce来源：docsSource/sections/07-custom-builds.md17-19
构建系统还负责为文档站点生成 CSS
构建系统包含与版本控制集成的脚本，用于发布
version 脚本运行构建过程，并将生成的文件添加到 Gitpostversion 脚本将更改和标签推送到远程存储库PostCSS 配置定义在 postcss.config.js 中，它
当以兼容模式 (compat) 运行时，前缀被设置为空字符串，从而有效地从类名中删除前缀。
构建系统配置为支持现代浏览器，同时保持与旧浏览器的兼容性
package.json 中的 browserslist 配置目标是