瀏覽器scss編譯

㈠ sass怎麼編譯同一文件下的不同scss

編譯sass文件 在命令行下進入到sass文件所在目錄， 運行>compass compile 也可以指定要編譯的文件 >compass compile fileName.scss #sass文件夾下會有個config文件指定編譯後的css存放位置。

㈡ 用koala編譯scss失敗，出錯是怎麼回事

我最近也在學sass，之前用的是sublime test2，這個編譯器有個好處就是轉譯成css的時候方便，但是終究還是和項目分離，也很麻煩。後來發現只要通過命令行一直監視整個目錄或者文件就方便多了，只要保存，sass就會自動編譯，

㈢ 為什麼首頁引入的是css，但瀏覽器f12卻是scss

導入.sass或.scss文件
css有一個不太常用的特性，即@import導入功能，它允許在一個css文件中導入其他css文件。然而，結果是只有執行到@import規則時，瀏覽器才會去下載其他css文件，這會導致頁面樣式載入特別慢，從而容易出現頁面閃的問題。
sass也有@import導入規則，與css不同的是，sass中的@import規則會在生成css文件時，把相關的文件導入合並成一個文件，而無需瀏覽器去下載其他的文件。另外在被導入文件中定義的變數等也可以在導入文件中正常使用。
在使用@import導入sass文件時，可以省略sass文件的後綴名.sass或.scss，例如：
- a.scss
body {
background-color: #f00;
}
- style.scss
@import "a";
div {
color: #333;
}

編譯後的style.css文件內容如下:
body {
background-color: #f00;
}
div {
color: #333;
}

㈣ 為什麼html中引用scss不能在瀏覽器預覽效果

不是已經生成css了嗎。。。html不能直接使用scss，你講link里的引用改為「test.css」，而不是.scss

㈤ 為什麼用scss編譯過的css文件不能提交

可能出現的原因：1.可能引入的css文件代碼被注釋了。2.可能路徑寫錯了。3.可能css代碼寫錯了。4.可能還要再重啟一下myeclipse。解決的方法：1.檢查一下jsp代碼中引入的css文件的那塊代碼。以下形式：去掉因為myeclipse默認是把css樣式注釋掉的。2.檢查路徑是否寫錯。3.css代碼寫錯了。4.重啟一下myeclipse，去掉上面的注釋之後，關閉myeclipse，再重新打開myeclipse，就可以看到css效果已經載入成功了。

㈥ 安裝完sass-loader載入器解析 後怎麼將scss文件編譯成css

比如我使用webpack，那麼我打包的時候，編譯器就會幫我編譯好了。
LESS同理。

㈦ 怎麼使scss編譯成css後，頂部有@charset=utf-8

明CSS文件的頁面編碼為UTF-8。。如果這個CSS的文件編碼也是UTF-8的話。。那麼在瀏覽器中看到的CSS文件的頁面中中文的注釋或者中文字體就可以正確顯示為中文，如果CSS的文件編碼和頁面不一致的話。那麼這個CSS文件的中文則會顯示為亂碼。。特別是定義中文字體的時候。就不能正確識別。

㈧ webstorm 編譯 scss 文件報錯

打開webstorm創建空項目，點擊「File」菜單選擇「Setting」，搜索「watcher」關鍵字，

點擊右邊綠色加號，選擇「SCSS」文件類型。

輸入監視文件類型名稱(隨便寫)，關鍵第二個選項，一定要選擇ruby安裝目錄bin文件下的scss.bat文件

最後，創建.scss文件輸入scss css代碼，保存後會生成後綴.css文件，就可以了。

㈨ 怎麼使用Less/Sass編譯工具koala

一、SASS調試插件的方法
如需調試功能，請在編譯輸出的時候輸出debug信息，那樣解析的css文件中就會包含debug信息，然後通過firebug或谷歌的調試工具就可以定位到我們編輯的scss文件，而不是解析後的css文件。
如果光做好SASS的准備工作還不夠，還需要讓瀏覽器支持SASS。那麼就需要一個瀏覽器的插件才能讓瀏覽器識別SASS，從而方便開發人員進行開發。
如需調試功能，請在編譯輸出的時候輸出debug信息，那樣解析的css文件中就會包含debug信息，然後通過firebug或谷歌的調試工具就可以定位到我們編輯的scss文件，而不是解析後的css文件。(如圖1-1)

圖1-1

如果你的css文件中沒有以@media -sass-debug-info開頭的代碼，說明沒有輸出debug信息。請重新使用koala工具編譯你的scss文件，並確定已經勾選了debug信息這個選項。
在火狐中調試，只需要再下載FireSass→即可。
二、編譯工具koala的安裝
1、進入頁面
2、根據系統下載所需要的koala的版本
3、然後在下載文件夾中安裝下載的EXE文件，即可安裝成功
三、編譯工具koala的優點
1、多語言支持：支持Less、Sass、CoffeeScript 和 Compass Framework。
2、實時編譯：監聽文件，當文件改變時自動執行編譯，這一切都在後台運行，無需人工操作。
3、編譯選項：既可統一設置文件的編譯選項，也可單獨設置某個文件的編譯選項。
4、強大的文件右鍵功能：右鍵文件元素，即可操作打開文件，打開文件目錄，打開輸出文件目錄，設置輸出文件目錄，編譯，刪除六大常用功能。
5、錯誤提示：在編譯時如果遇到語法的錯誤，koala將在右下角彈出錯誤信息，方便開發者定位代碼錯誤位置。
6、跨平台：windows、linux、mac都能完美運行。
7、免費且負責：koala完全免費，而且作者很負責，有什麼問題作者都會及時給予答復，意見什麼的可以直接提交給作者，一般在下一個版本就能得到解決。

㈩ webstorm怎麼編譯scss的壓縮輸出方式 compressed

方法/步驟
1
1、下載ruby最新版2.1.5，安全起見可以安裝ruby 1.9.3-p551
ruby安裝文件自己網路一下，容易找到。
2
2、安裝過程中，一定注意勾選第二項！否則cmd命令會找不到。

3
3、安裝完後，檢查是否安裝成功
Win+r快捷鍵啟動cmd命令窗口，輸入ruby -v，注意中間空格，顯示版本號說明成功。

4
4、藉助ruby安裝sass，dos命令窗口輸入「gem install sass」
該命令一定要在system32文件下cmd.exe執行，默認安裝目錄在C:\Windows\System32\cmd.exe文件

5
5、安裝過程中，耐心等待，直到提示安裝進度100%。
同樣通過「sass -v」命令(中間有空格)檢查安裝結果，顯示當前版本號。

6
6、接著需要配置webstorm下sass編譯環境。
打開webstorm創建空項目，點擊「File」菜單選擇「Setting」，搜索「watcher」關鍵字，

7
7、點擊右邊綠色加號，選擇「SCSS」文件類型。

8
8、輸入監視文件類型名稱(隨便寫)，關鍵第二個選項，一定要選擇ruby安裝目錄bin文件下的scss.bat文件

9
9、最後，創建.scss文件輸入scss css代碼，保存後會生成後綴.css文件，說明環境編譯沒問題。