如何查看 sass 文件答案

【问题标题】：how to watch a sass file如何查看 sass 文件
【发布时间】：2017-02-10 17:07:28
【问题描述】：

我刚决定开始学习 sass，但在我的电脑上运行 sass 仍然有点困难。我已经下载并安装了它，如图所示：

我拥有该项目的文件夹位于 xampp 文件夹中的 htdocs 文件夹中。我在命令行上输入了 C:\Users\Thulani>sass --watch C:\xampp\htdocs\ruby\lib\sass\style.scss:style.css 但它只说 sass 正在监视变化。

我如何才能真正更改我的 style.scss 并查看这些更改？

这是我的html：

<html>
<head>
   <title> Import example of sass</title>
   <link rel="stylesheet" type="text/css" href="style.css"/>
</head>
<body>
   <h1>Simple Example</h1>
   <h3>Welcome to TutorialsPoint</h3>
</body>
</html>

请帮忙

【问题讨论】：

您是否尝试过更改您的 style.scss？如果您正在运行--watch 任务，则对输入所做的任何更改都将被编译并输出到您选择的目的地。 sass-lang.com/documentation/file.SASS_REFERENCE.html#using_sass
是的。我尝试更改 style.scss 上的某些内容，但没有任何反应

标签： css ruby-on-rails sass

【解决方案1】：

在您要观看的文件夹中使用此命令。

sass -w src/assets

如果你不想要地图文件使用这个

sass -w src/assets --sourcemap=none

【讨论】：

【解决方案2】：

根据您给出的信息，我只能说您可能犯了一个错误，即实际上没有从您的 CSS 文件中调用任何类或 id。如果您也可以上传它会很好，但我假设您尝试仅设置 <h1> 和 <h3> 元素的样式。既然你是新人，我会给你写一些应该运行的非常简单的测试代码。

这是我的 HTML 文件：

  <!DOCTYPE html>
  <html lang="en-GB">
  <head>
    <meta charset="utf-8">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <meta name="viewport" content="initial-scale=1">

    <title>Test</title>

    <link type="text/css" rel="stylesheet" href="style.css"/>
 </head>
 <body>
    <div id="red">
       <h1>I am red !</h1>
     </div>
     <div id="blue">
       <h2>I am blue</h2>
     </div>
   </body>

我的 SCSS 文件：

    //@import "Filename";
// use import if you want to link two or more style sheets together (makes one big css file)

/* Colours used */
$red: red;
$blue: blue;

html, body{
    width: 100%;
    overflow-x:hidden;
    margin: 0;
    padding: 0;
}
body {
    background-color: white;
    font-family: sans-serif;
}
#red {
    color: $red;
}
#blue {
    color: $blue;
}

SCSS to CSS conversion test pass

【讨论】：