SASS输出样式自动化,包括压缩文件。

3

我正在尝试使用SASS,想要创建一个style.css文件,并将该文件压缩为style.min.css。

sass --watch sass/style:css --style compressed

这很好,但我需要自动化编译和压缩的过程。

我在其他stackoverflow中找到了这段代码:

sass --watch sass/style.scss:css/style.css --watch css/style.css:css/style.min.css --style compressed --scss

但现在它不按我想要的方式工作了。此外,2020年Sass网页上的代码已经不同了。

https://sass-lang.com/documentation/cli/dart-sass#style

我不使用gulp工具,因为我认为这对于WordPress项目来说并不必要。

有人可以帮助我吗?


使用 node-sasssass 更快。 使用非常简单:node-sass ./style.scss ./style.min.css -w --output-style compressed - Grzegorz T.
不起作用。node-sass:未将“node-sass”识别为 cmdlet、函数、脚本文件或可执行程序的名称。请检查您是否正确拼写了名称或者路径是否正确,然后重试。 - Antonio Ángel Estrada Pérez
1个回答

7

无论您使用什么技术构建网站,如果您想要完全控制编译/压缩/其他操作,那么 gulp 等工具就是为此而存在的。

看起来您正在尝试将 SCSS 编译成 CSS 并输出到文件,然后再对编译后的 CSS 文件进行压缩。但该 CLI 工具不能实现这一点,但它绝对可以同时从源 SCSS 进行编译/压缩操作。

使用您正在使用的二进制文件,这将编译和压缩,以 ./sass/style.scss 作为输入,将结果输出到 ./css/style.min.css

sass sass/style.scss:css/style.min.css --style compressed

如果您想让它对您的scss文件中的文件更改做出反应,请添加--watch

或者,也许您想同时获得未经缩小和经过缩小的版本。在这种情况下,您只需要运行两个命令即可。再次强调,gulp可以自动化此过程。

其他二进制文件将具有不同的标志和选项,当然还有gulp选项,我肯定会推荐使用它,因为您就不必记住任何冗长的命令,并且可以在项目之间共享所选的结构/任务。


那几乎完美地运作了。唯一的错误是输出的style.css和style.min.css具有相同的压缩代码,这是否工作良好? - Antonio Ángel Estrada Pérez
1
这不会生成一个style.css文件,如果存在该文件,则是由您之前执行的某些操作导致的。 - Josh Davenport-Smith

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接