sass 安裝
1.全局安裝 sass 個人Mac 因此不用再安裝Ruby ,直接在終端輸入css
1 gem install sass
而後在終端中輸入 html
sass -v
出現 Sass 3.4.8 (selective steve) ,表示安裝成功。
sass的編譯
1. 使用 sublime text 2
1.1 preferences-->PackageControl---> 輸入 install package ----》輸入 SassBuilder 安裝插件完成
1.2 新建項目 ---》新建 my.scss
1.3 選擇 sublime text 2 工具欄中的 tool---->sassbuilder config 而後保存爲 .sassbuilder-config 保存到項目的根目錄下 ,修改你的 .sassbuilder-config 中的輸出生成.css 文件的路徑git
1.4 修改my.scss 保存 ,則在 你.sassbuilder-config 中的輸出生成.css 文件的路徑 下生成了my.css 文件的github
2. 使用 gulp 有點大材小用的樣子 O(∩_∩)O~~
2.1 安裝 gulp
sudo npm install -g gulp
在終端中輸入 gulp -v
出現 CLI version 3.8.10
表示安裝成功。
2.2 回到你的新建的項目中 cd /yourproject/, 將gulp 安裝到項目的本地
在終端中輸入
npm install —-save-dev gulp
2.3 在你的項目中 跟目錄下 新建一個 空的 package.json
2.4 安裝你須要的依賴 如
npm install gulp-jshint gulp-sass gulp-concat gulp-uglify gulp-rename --save-dev
2.5 在你的項目中 跟目錄下 新建一個 gulpfile.js
編寫你的 任務
如:npm
//包含gulp var gulp = require('gulp'); //包含咱們的插件 var jshint = require('gulp-jshint'); var sass = require('gulp-sass'); var concat = require('gulp-concat'); var uglify = require('gulp-uglify'); var rename = require('gulp-rename'); var notify = require("gulp-notify"); //編譯sass gulp.task('sass',function(){ gulp.src('./sass/my.scss') .pipe(notify("scss build successful ")) .pipe(sass()) .pipe(gulp.dest('./style')); }); //拼接、簡化JS文件 gulp.task('scripts',function(){ gulp.src('./js/*/js') .pipe(concat('all.js')) .pipe(gulp.dest('./dist')) .pipe(rename('all.min.js')) .pipe(uglify()) .pipe(gulp.dest('./dist')); }); //默認任務 gulp.task('default',function(){ gulp.run('sass','scripts'); //監視咱們JS文件的變化 gulp.watch('./js/*.js',function(){ gulp.run('scripts'); }); //監視scss文件的變化 gulp.watch('./sass/*.scss',function(){ gulp.run('sass'); }); });
2.6
在終端中輸入
gulp
2.7 新建你的sass 文件 保存
發如今gulpfile.js 中輸出.css文件的路徑下生成了 編譯好的文件;json
3. gulp
使用更加簡單 sass
http://www.cn-sass.com/%E6%95%99%E7%A8%8B/sass-gui-tool-koala.htmlkoa
4. ionic sass 編譯
http://learn.ionicframework.com/formulas/working-with-sass/
若是 在 ionic setup sass 出現了錯誤 ,你能夠看看這個鏈接
https://github.com/driftyco/ionic/issues/2241
主要是你沒有安裝 gulp 引發的錯誤 安裝一下就能夠了ionic