使用 Node-sass 缩小 CSS答案

【问题标题】：Minify CSS with Node-sass使用 Node-sass 缩小 CSS
【发布时间】：2017-03-27 12:49:51
【问题描述】：

我在我的 NodeJS 项目中使用 SCSS，并让我的脚本使用以下命令将我所有单独的 SCSS 文件转换为单个 CSS 文件

node-sass -w public/css/scss/style.scss public/css/style.css

我唯一的问题是我还希望缩小 CSS 文件。这可能与 Node-sass 吗？文档说有一个“紧凑”选项，但是当我尝试时它似乎不起作用

node-sass -w compact public/css/scss/style.scss public/css/style.css

提前感谢您的帮助。

【问题讨论】：

【解决方案1】：

由于 LibSass 和 Node Sass are deprecated
使用 Dart-SASS 包：npm install --save-dev sass

_package.json

{
  "scripts": {
    "scss": "sass --style=compressed --watch src/scss:public/css"
  },
  "devDependencies": {
    "sass": "^1.32.7"
  }
}

要运行它并查看文件更改，请在终端中运行：

npm run scss

给定一个文件夹结构，如：

_{?︎ package.json
?︎ public
?︎ css
?︎ style.css ← 缩小和压缩
?︎ src
?︎ scss
?︎ style.scss}

【讨论】：

【解决方案2】：

"scss": "node-sass --watch scss -o app/css"这对我有用

【讨论】：

【解决方案3】：

node-sass 支持使用 --output-style 参数输出缩小的 CSS。

输出样式

安装 node-sass npm 包后。我在 package.json 文件中添加了 build-css 行。

  "scripts": {
    "build-css": "node-sass --include-path scss scss/main.scss   public/css/main.css --output-style compressed",
  },

然后我只需键入 npm run build-css 即可将 /scss/main.scss 文件中的内容转换为 /public/css/main.min.css 中的压缩（缩小）css

更多信息可以在 node-sass Github repo 的文档中找到https://github.com/sass/node-sass#outputstyle

【讨论】：

【解决方案4】：

在node-sass documentation中说你要使用 --output-style，也可以是nested | expanded | compact | compressed。缩小使用compressed

例如：

node-sass -w public/css/scss/style.scss public/css/style.css --output-style compressed

将缩小 CSS。

【讨论】：

node-sass 现已弃用。尽管这在 2016 年是正确的，但还是建议使用 Roko C. Buljan 回答的 Dart-SASS 包。
@dasper 不确定 node-sass 是否也被弃用，也许它很快就会使用 Dart Sass？
@Timo in github.com/sass/node-sass 明确将此警告放在首位：警告：LibSass 和 Node Sass 已弃用。虽然他们将继续无限期地接收维护版本，但没有计划添加额外的功能或与任何新的 CSS 或 Sass 功能兼容。仍在使用它的项目应该转移到 Dart Sass。