如何编译或转换sass/scss到css与node-sass(没有Ruby)？

我一直在努力设置libsass，因为它不像基于Ruby的transpiler那么直接。可能有人解释如何：

>安装libsass？
>使用它从命令行？
>使用它与任务跑步者像gulp和grunt？

我对包管理器的经验很少，对于任务运行者来说更是如此。

解决方法

我为libsass选择了node-sass实现器，因为它基于node.js。

安装node-sass

>(先决条件)如果您没有npm，请先安装Node.js。
> $ npm install -g node-sass全局安装node-sass -g。

这将希望安装所有你需要，如果不是读libsass在底部。

如何使用命令行和npm脚本的node-sass

一般格式：

$ node-sass [options] <input.scss> [output.css]
$ cat <input.scss> | node-sass > output.css

例子：

> $ node-sass my-styles.scss my-styles.css手动编译单个文件。
> $ node-sass my-sass-folder / -o my-css-folder /手动编译文件夹中的所有文件。
> $ node-sass -w sass / -o css /在源文件被修改时自动编译文件夹中的所有文件。 -w添加了对文件更改的监视。

更多有用的选项，如’compression’@ here.命令行适用于快速解决方案，但是，您可以使用Grunt.js或Gulp.js等任务运行器来自动化构建过程。

您还可以将上述示例添加到npm脚本。要正确使用npm脚本作为gulp的替代，请阅读this comprehensive article @ css-tricks.com，特别是阅读关于grouping tasks。

>如果在项目目录中没有package.json文件，运行$ npm init会创建一个。使用它与-y跳过问题。
>将“sass”：“node-sass -w sass / -o css /”添加到package.json文件中的脚本。它应该看起来像这样：

"scripts": {
    "test" : "bla bla bla","sass": "node-sass -w sass/ -o css/"
 }

> $ npm run sass将编译您的文件。

如何使用gulp

> $ npm install -g gulp全球安装Gulp。
>如果在项目目录中没有package.json文件，运行$ npm init会创建一个。使用它与-y跳过问题。
> $ npm install –save-dev gulp本地安装Gulp。 –save-dev将gulp添加到package.json中的devDependencies。
> $ npm install gulp-sass –save-dev本地安装gulp-sass。
>通过在您的项目根文件夹中创建一个包含此内容的gulpfile.js文件，为您的项目设置gulp：

'use strict';
var gulp = require('gulp');

舒展的一个基本例子

将此代码添加到您的gulpfile.js：

var sass = require('gulp-sass');
gulp.task('sass',function () {
  gulp.src('./sass/**/*.scss')
    .pipe(sass().on('error',sass.logError))
    .pipe(gulp.dest('./css'));
});

$ gulp sass运行上面的任务，它编译.sass文件夹中的.scss文件，并在css文件夹中生成.css文件。

为了使生活更轻松，让我们添加一个手表，所以我们不必手动编译。将此代码添加到您的gulpfile.js：

gulp.task('sass:watch',function () {
  gulp.watch('./sass/**/*.scss',['sass']);
});

全部设置了！只需运行watch任务：

$ gulp sass:watch

如何使用Node.js

正如node-sass的名字所暗示的，你可以编写自己的node.js脚本进行翻译。如果你好奇，请查看node-sass项目页面。

libsass呢？

Libsass是一个需要由实现者构建的库，例如sassC或我们的node-sass。 Node-sass包含默认使用的libsass的内部版本。如果构建文件在您的计算机上不工作，它会尝试为您的计算机构建libsass。这个过程需要Python 2.7.x(3.x在今天不工作)。此外：

LibSass requires GCC 4.6+ or Clang/LLVM. If your OS is older,this version may not compile. On Windows,you need MinGW with GCC 4.6+ or VS 2013 Update 4+. It is also possible to build LibSass with Clang/LLVM on Windows.

原文地址：https://www.jb51.cc/css/220174.html