Css 如何查看包含许多sass文件的整个目录/文件夹中的更改

Css 如何查看包含许多sass文件的整个目录/文件夹中的更改,css,sass,build-process,watch,Css,Sass,Build Process,Watch,如何跟踪包含许多sass文件的整个目录中的更改?我使用以下命令来观察sass中的更改 文件: 但是如何查看包含许多sass文件的整个目录/文件夹中的更改。您可以创建一个包含其余文件的sass文件,然后只查看此文件 或者,查看非常好的插件,只需使用命令sass--watch:,如下所示: $ ls -l css/ sass/ $ sass --watch sass:css 其中包含Sass文件和托管生成的CSS文件的。通过piouPiouM稍微扩展答案: 除了以.css结尾外,将使用与输入文件

如何跟踪包含许多sass文件的整个目录中的更改?我使用以下命令来观察sass中的更改

文件:


但是如何查看包含许多sass文件的整个目录/文件夹中的更改。

您可以创建一个包含其余文件的sass文件,然后只查看此文件


或者,查看非常好的插件,只需使用命令
sass--watch:
,如下所示:

$ ls -l
css/ sass/
$ sass --watch sass:css

其中
包含Sass文件和托管生成的CSS文件的

通过piouPiouM稍微扩展答案:

  • 除了以
    .css
    结尾外,将使用与输入文件相同的名称创建输出文件
  • 可以相同
  • 两个文件夹都可以是当前工作目录,因此以下内容有效:

    $sass——观察。


我最终没有使用Grunt或Sass手表:

npm install -g watch
watch "sass assets/app.scss assets/dist/app.css" assets/css

转到终端,找到文件夹,然后写下:

 sass --watch .
这将监视所有sass文件并转换为同名的css文件。 您也可以这样做:

sass --watch ~/user/youUser/workspace/project/styles/

我希望这能对您有所帮助。

根据信息,您可以使用下一个命令行:

sass --watch .

来源:

以防万一2018年有人面临这个问题:
sass网站指的是已经发布的信息。 现在(2018年5月),如果您通过npm安装dart sass,它不支持

该做什么:
您需要安装
节点sass
globaly,如:

npm install node-sass -g
然后重新启动命令行,然后使用以下代码:

node-sass --watch scss/styles.scss css/styles.css
将scass文件编译为css。
基本上节点sass支持
--watch
命令,我们使用该命令将scss代码编译为常规css文件。

万一您在第一次保存.scss文件时遇到这样的错误:

{
  "status": 3,
  "message": "File to read not found or unreadable: yourdirectory/scss/styles.scss",
  "formatted": "Internal Error: File to read not found or unreadable: yourdirectory/scss/styles.scss\n"
}

您需要做的是再次保存它,它将正常工作

如果您在当前文件夹中,请执行以下操作观看

F:\sass tutorial>sass --watch ./:./

您可以将sass设置为监视所有要编译的.scss文件(在我的示例中,我在src/static文件夹中获得了几个.scss文件),但在全局安装之前:

npm i -g sass
然后转到项目文件夹并键入以下命令:

sass --watch $(pwd)/src/static 
还可以将其包装在package.json中的npm脚本中,如

 "scripts": {
    "sass:watch": "sass --watch $(pwd)/src/static"
    }
    
并通过以下命令运行它:

npm run sass:watch

@matsko是的,
grunt watch
doesI就是这样做的:我当前的项目不需要一个SASS文件。这是一个糟糕的建议/答案。更简单的方法是让SASS监视一个目录,其他人在他们的回答中已经说明了这一点。您可能需要一个主SASS文件用于项目,其中包括所有子组件SASS文件(看看bootstrap是如何做到的)。当前公认的答案还有一个主要缺陷,即它编译所有sass文件,并为每个sass文件输出一个css文件(不包括部分)。这可能不是您想要的。是否在您的工作web目录中安装sass?如果它安装在系统级,我是否必须键入整个路径?所以
sass--watch/Users/estout/Documents/GIT/project/:/Users/estout/Documents/GIT/project/
@buschchwick:是的,您可以在系统级安装它。你要么每次都输入完整地址,就像你,或者更简单的方法是更改目录
cd/Users/estout/Documents/GIT/project/
,然后编写
$sass——注意。
这里的答案对您有帮助吗?如果我有一个
sass
文件夹,其中包含20个子目录和总共200个
scss
文件,在这种情况下,
sass--watch
会对CPU/内存资源产生什么影响?@piouPioum,我已经尝试了您提到的命令,它检测到更改,但没有写入。它说找不到名为“watch”的选项。。我不知道该怎么办,我不敢相信我不能在没有安装外部程序或使用任务运行器的情况下运行观察器,当然现在是这样了。我没有看到任何与
watch
on等价的东西。是的,但还不是100%确定如何在节点代码中使用,例如,有。
npm run sass:watch