将 Half-SASS、Half-CSS 改造成 SASS 的简单方法？答案

【问题标题】：Easy Way To Retrofit Half-SASS, Half-CSS to SASS?将 Half-SASS、Half-CSS 改造成 SASS 的简单方法？
【发布时间】：2012-02-23 06:58:45
【问题描述】：

我接手了一个通过 SASS 创建 CSS 的项目。当时我不熟悉 SASS，并开始手动更新最后一个输出文件。我的经理得知我没有使用 SASS，并坚持要我将所做的一切（大量添加和调整）更改为 SASS，然后在项目中再次使用它。

有什么工具可以帮助我做到这一点吗？我在想可能会生成最后一个文件并查看该文件与我当前编辑的文件之间的区别并尝试将这些规则添加到 SASS 文件中，但我不知道有任何工具会获取两个文件并向您展示差异。

谢谢

【问题讨论】：

标签： css sass

【解决方案1】：

首先，您需要确定您正在处理的 css 文件是怎样的。请注意，在嵌套模式下，通过// 完成的所有 sass 上的 cmets 都将被忽略输出。如果你得到的 css 文件处于生产模式，所有的 cmets 都会被剥离，css 文件会被缩小，这对转换不利。

我的建议是备份你正在使用的 css 文件；然后在config.rb所在的目录下运行sass watch，会根据原来的sass项目重新生成css文件。

之后，抓取这两个文件并使用Diff Tool，如果您不想在本地使用difftool，您可以随时创建一个公共GitHub存储库并放置原始css文件，然后提交新的，查看差异。

完成此操作后，您应该根据已编译的选择器进入文件，并添加缺少的属性。

这样你就完成了，在某种程度上你可以保留 cmets 和原来的预期结构。

【讨论】：

【解决方案2】：

在 CSS 文件上运行 sass-convert 以生成等效的 SASS 文件。然后将您创建的 SASS 文件与原始 SASS 文件进行比较。

另外，看看是否有办法在生成的 CSS 文件的顶部放置一个大的“自动生成文件 - 请勿编辑”横幅 :)

【讨论】：

sass-convert 安装时附带 sass 并允许您从 css 转换为 sass 或 scss。在他们的documentation 中阅读更多信息。我会说保留原始 css 并使用 @kuroir 所说的 diff 命令。

【解决方案3】：

我个人会使用 css2sass 或命令行将 CSS 转换为 SASS，学习 SASS 语法，然后开始手动修剪代码（将经常重复的样式等转换为 mixins 和扩展）。遍历所有代码需要一些体力劳动，但它会更好并与现有代码一起使用。

【讨论】：

【解决方案4】：

如果您运行sass style.scss，它将为您将其转换回 css 并在控制台中输出结果（提示） - 您可以从那里复制和粘贴

运行 sass --help 以获取有关如何将其写入文件的信息

【讨论】：

【解决方案5】：

http://css2sass.heroku.com/

然后切换到 scss 语法。好多了。

【讨论】：