SCSS 安裝和使用

一、安裝 ruby

1、安裝 rvm

$ curl -l  | bash -s stable

$ source ~/.rvm/scripts/rvm
檢視是否安裝成功：
$ rvm -v
列出已知的ruby版本
$ rvm list known

$ ruby -v

ruby 2.0.0p247 (2013-06-27 revision 41674) [x86_64-darwin13.0.0]
$ gem -v
2.1.6
$gem source -r 
$ gem source -a

$ gem sources -l

到這裡就已經把ruby環境成功的安裝到了mac os x上，接下來就可以進行相應的開發使用了。

二、安裝 sass

sudo gem install sass

sudo gem install compass --pre

$ sass -v

三、執行

命令列

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

在設定裡找到 setting -> tools -> file watchers -> add -> scss -> arguments 填入：

ps:如果沒有file watchers，到 plugin 裡面去搜尋 file watchers 安裝。

--no-cache --update --compass  --style compressed $filename$:../css/$filenamewithoutextension$.css

../css/$filenamewithoutextension$.css:../css/$filenamewithoutextension$.css.map

compass 需要安裝：

gem install compass

webpack之使用less和scss

前言 本文以sass為例，其實，應用sass或者less，是指先將檔案交給sass load或者less loader處理成css檔案，然後再交給css loader style loader進行處理。如果你的專案中使用了scss。安裝sass loader node sass 我們目前的專案目錄 ...

使用 Nginx 編譯 Sass 和 Scss

前端的小夥伴對於 sass 或 scss 以下統稱 sass 應該並不陌生，他是一種 css 預處理語言，使用 sass 可以極大簡化 css 的編寫和維護。通常情況下，我們在開發環境下使用 sass 是在 webpack dev server 或者 gulp 環境下，通過監聽檔案修改來實時編譯 s...

vue cli專案使用scss

介紹乙個vue專案給大家學習，閱讀別人的專案可以快速提高自己哦，移動端vue完整專案 安裝node sass sass loader style loader，進入webpack.base.config.js配置scss。所以增加如下 當然，如果需要在vue檔案style標籤使用scss的話，需要宣...