观察所有 sass 文件的变化并将它们保存在一个 css 文件中

Question

在我的 package.json 中，我有以下脚本：

"watch:sass": "node-sass -w sass/main.scss style/style.css "

它等待 main.scss 文件的变化，然后分别改变 style.css。我的 main.scss 文件基本上是一个集合，它导入了一堆其他的 scss 文件。

@import "abstracts/variables"; //abstracts/_variables.scss
@import "abstracts/mixins"; // abstracts/_mixins.scss
@import "base/base";  //base/_base.scss
@import "base/typography"; //base/_typography.scss

问题是，当我在其他 scss 文件中时，例如我编辑 _base.scss，当我更改它并保存时 - 我的 style.css 不会自动更新。只有当我返回 main.scss 并保存它时，才会刷新 style.css。

如何在我的任何 sass 文件中进行更改，以便 style.css 也将更新？

Answer 1

您可以使用通配符*：

"watch:sass": "node-sass -w sass/*.scss style/style.css"

但请确保您所有的 SCSS 文件都在 sass 文件夹中。

Answer 2

试试这个代码

"scss": "node-sass --watch sass/main.scss:css/style.css"

这对我有用。