gulp-clean-css 必须在 PostCSS 之后执行，否则 autoprefixer 和 postcss-import 因压缩后代码结构破坏而报错或失效；正确顺序为：gulp-sass → gulp-postcss → gulp-clean-css；需显式配置 sourcemap、IE8 兼容及注释保留策略。
gulp-clean-css 必须在 PostCSS 之后执行
PostCSS（含 autoprefixer、postcss-import）处理的是未压缩的原始 CSS，如果把 gulp-clean-css 放在 gulp-postcss 前面，压缩后的单行代码会让 autoprefixer 找不到属性上下文，报错 Unclosed bracket 或漏加前缀；postcss-import 也依赖原始结构解析路径。
正确顺序只能是：gulp-sass（或 gulp-less）→ gulp-postcss（含 postcss-import + autoprefixer）→ gulp-clean-css。若用 gulp-sass 编译，它已默认内联 @import，此时可跳过 postcss-import，但 autoprefixer 仍不可少。
-
cleanCSS()默认不生成 sourcemap，要调试必须显式传{ sourceMap: true }，且确保gulp-sourcemaps.init()在最前、gulp-sourcemaps.write()在最后 - 兼容 IE8 时，
cleanCSS({ compatibility: 'ie8' })必须设，否则*zoom: 1这类 hack 全被删光 - 注释不删？加
level: { 1: { specialComments: 0 } }，否则 license 注释全保留，体积虚高
合并 CSS 不能靠 gulp-concat 直接拼文件
gulp-concat 只做字符串拼接，不解析 @import，也不展开变量或处理作用域。直接对含 @import "base.css" 的文件运行 concat，结果里只留原样语句，浏览器加载时 404。
真正安全的合并路径只有两条：
立即学习“前端免费学习笔记（深入）”；
- 先用
gulp-sass/gulp-less编译全部源文件（它们自动内联@import），再把输出 CSS 流交给concat - 或用
gulp-postcss+postcss-import插件提前内联，再concat—— 注意postcss-import的resolve需配path.dirname(from)，否则相对路径失效 - 文件顺序必须写死数组：
gulp.src(['src/css/reset.css', 'src/css/variables.css', 'src/css/components/*.css'])，别信 glob 字母序，theme.css排在reset.css前就全乱了
HTML 中的 <link> 不会自动更新
生成了 dist/css/app.min.css，但 HTML 里还是多个 <link href="css/a.css">，浏览器根本不会加载新文件——这不是“没生效”，是压根没请求。
注入方案有两种，选错就白跑：
-
gulp-inject：要求 HTML 中有<!-- inject:css -->标记，且 CSS 文件已写入磁盘（即pipe(gulp.dest())已执行），base选项必须设对，否则注入路径错成dist/css/app.min.css而不是css/app.min.css -
gulp-rev-collector：读取rev-manifest.json映射，批量替换所有旧路径，但会直接覆写 HTML 文件，务必确认备份策略；它适合多页共用一套资源的场景 - 开发时打开 Chrome Network 面板，点开注入的 CSS 链接，404 就说明路径不对，别猜，直接看请求地址
MD5 重命名和 HTML 替换必须链式串行
gulp-rev 加哈希、gulp-rev-collector 替路径，这两步断开就会出问题。常见错误是：CSS 压缩合并后没加 rev，却让 rev-collector 去找 app.min.css 对应的哈希名，结果啥也没替。
完整链路必须是：gulp-clean-css → gulp-rev（生成 app.min-abc123.css 和 rev-manifest.json）→ gulp.dest()（落地文件）→ gulp-rev-collector（读 manifest，改 HTML 中的 href）。
容易被忽略的点：
-
rev.manifest()必须在gulp.dest()之后调用，否则 manifest 写的是空对象 - HTML 中引用路径必须和
gulp.src()的base匹配，比如gulp.src('dist/index.html', { base: 'dist' })，才能保证替换后是css/app.min-abc123.css而非dist/css/app.min-abc123.css - 如果 CSS 文件名本身带哈希（如
button.a1b2c3.css），rev会再叠一层，导致文件名过长，建议预处理阶段统一清理
