将 scss 转换为 css [关闭]

Posted 2023-03-06

【中文标题】将 scss 转换为 css [关闭]

【英文标题】：Converts scss to css [closed]

【发布时间】：2012-11-18 22:11:50

【问题描述】：

有谁知道如何将此代码转换为标准 css？ 它在他们的编辑器中不起作用。

http://codepen.io/andymcfee/pen/eyahr

【问题讨论】：

sass2css.herokuapp.com

【参考方案1】：

如果你在 CodePen 中点击标题CSS (SCSS)（不要用齿轮改变预处理器）它会切换到编译后的 CSS 视图。

【讨论】：

现在右侧有一个眼睛图标可以完成这项工作。

您知道必须单击 CSS 选项卡顶部附近的“查看已编译”按钮。

在撰写本文时，css 选项卡的右上角有一个“插入符号”，可以完成这项工作。将出现一个下拉菜单，选择“查看编译的 CSS”。

2020年，您可以点击css面板右上角的向下箭头图标，打开一个下拉菜单，选择“查看编译的css”。您可以通过选择“查看未编译的 css”来切换

【参考方案2】：

在终端中，在系统表所在的文件夹中运行此命令：

sass --watch style.scss:style.css 

来源：

http://sass-lang.com/

当它注意到.scss 文件发生变化时，它会更新您的.css

这仅在您的 .scss 在您的本地计算机上时有效。尝试将代码复制到文件并在本地运行。

【讨论】：

我在 Windows7 上。我在哪里可以找到终端？这不是Linux的东西吗？如您所见，我对 sass 和终端一无所知。

使用 cmd，点击运行，然后点击 cmd。按照那里有关设置 scss 的网站上的说明进行操作。然后你可以在你的机器上保存你想要的文件并将其转换为 .css

哦，我明白了，谢谢。我希望有类似在线转换器的东西。这可能是我唯一一次使用 sass，所以我并不是真的想安装东西。不过，感谢您的帮助。

Sass 错误：未定义的 mixin 'backface-visibility' 和 Sass 错误：不一致的缩进：5 个空格用于缩进，但文档的其余部分使用 2 个空格缩进。奇怪的是，它们与我从这里得到的错误相同cssconvert.mgwebsolutions.net

好的。我最好的选择是看看这个，ohttps://www.google.co.uk/search?q=online+scss+compiler&oq=online+scss+compiler&aqs=chrome.0.57j60l2.467&sugexp=chrome,mod=7&sourceid =chrome&ie=UTF-8 似乎有一些你必须下载的转换。祝你好运。

【参考方案3】：

这是一个在线/离线解决方案，非常容易转换。 SCSS to CSS converter

【参考方案4】：

首先，如果你的机器上没有 Ruby，你必须安装它。

1.打开一个终端窗口。 2.运行ruby命令。

如果您看到诸如/usr/bin/ruby 之类的路径，则表示安装了Ruby。如果您没有看到任何响应或收到错误消息，则表示未安装 Ruby。 要验证您是否拥有当前版本的 Ruby， 运行命令ruby -v。

如果你的机器上没有安装 ruby​​，那么

sudo apt-get install ruby2.0
sudo apt-get install ruby2.0-dev
sudo update-alternatives --install /usr/bin/gem gem /usr/bin/gem2.0 1 

然后通过运行此命令安装 Sass gem

sudo gem install sass --no-user-install

然后复制或添加任何 .sass 文件并转到该文件路径，然后

sass --watch style.scss:style.css 

当它注意到 .scss 文件发生变化时，它会更新您的 .css

这仅在您的 .scss 位于本地计算机上时有效。尝试将代码复制到文件并在本地运行。

【参考方案5】：

您可以使用sass /sassFile.scss /cssFile.css

注意：使用sass命令前必须先安装ruby，再安装sass。

为了安装 sass，在你的 终端

提示：sass 编译 SCSS 文件

【参考方案6】：

使用以下命令安装 Ruby-sass sudo apt-get -y 更新 sudo apt-get -y install ruby​​-full sudo apt install ruby​​-sass 宝石安装捆绑器

示例 萨斯 SCSS_FILE_PATH:CSS_FILE_PATH;

例如 sass mda/at-md-black.scss:css/at-md-black.css;