Bootstrap 4. CSS 缩小会产生错误的结果

【问题标题】：Bootstrap 4. CSS minification produces wrong resultsBootstrap 4. CSS 缩小会产生错误的结果
【发布时间】：2016-01-23 13:42:36
【问题描述】：

我已经用 Bower 安装了 Bootstrap 4.0-alpha，现在我有了一个包含预编译 bootstrap.css 和 bootstrap.min.css 的 dist 目录。在开发环境中，我尝试不使用压缩版本，而是在部署中使用缩小版本。我使用 Laravel Elixir 来运行我的任务。压缩后，一些引导程序样式已更改。例如，h1 标签有“margin-top：0.67em”（它已经发生，因为“margin-top：0px”的优先级较低）。当然，我可以简单地使用 dist 目录中的预压缩文件，这完全可以。但是如果是我的minifier的问题，恐怕会导致进一步开发的错误结果。所以我的问题是为什么会这样？

【问题讨论】：

仅供参考，gulp-minify-css 已经 deprecated 支持 gulp-clean-css

标签： gulp laravel-elixir bootstrap-4 gulp-clean-css gulp-minify-css

【解决方案1】：

Bootstrap 构建链使用 grunt-contrib-css，后者使用 clean-css（版本 3.4.6）

在 Gruntfile.js 中设置了选项 noAdvanced: true。据我了解，这不是grunt-contrib-css 和clean-css 的选项。而是应该设置advanced: false：

cssmin: {
  options: {
    // TODO: disable `zeroUnits` optimization once clean-css 3.2 is released
    //    and then simplify the fix for https://github.com/twbs/bootstrap/issues/14837 accordingly
    compatibility: 'ie9',
    keepSpecialComments: '*',
    sourceMap: true,
    advanced: false
  },

【讨论】：

固定：github.com/twbs/bootstrap/commit/…