>安装libsass?
>使用它从命令行?
>使用它与任务跑步者像gulp和grunt?
我对包管理器的经验很少,对于任务运行者来说更是如此。
解决方法
安装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');
舒展的一个基本例子
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.