VS CodeやSublimeTextなどWEB関連のソース(HTML,CSS,プログラム)を記述する時の環境についてのTipsをメモっていきます

dart sass を VS Code で使用して SCSS (SASS)をコンパイルする

● A. (おすすめ)Live Sass Compilerをインストールして VS Code で SCSS (SASS)をコンパイルする

こちらをインストールします
https://marketplace.visualstudio.com/items?itemName=glenn2223.live-sass

インストール後に、ファイルを開いて一番したの watch sass をクリックするだけです。

設定 : 出力先を /assets/css" にする

"liveSassCompile.settings.formats": [
	{
		"format": "expanded",
		"extensionName": ".css",
		"savePath": "/assets/css"
	}
],

● B. (古いやり方)dart sass を VS Code で使用して SCSS (SASS)をコンパイルする

1. dart sass のインストール

npm install -g sass

dart sassの実行ファイルのパスを取得する

which sass

2. DartJS Sass Compiler and Sass Watcher のインストール

https://marketplace.visualstudio.com/items?itemName=codelios.dartsass

3. DartJS Sass Compiler and Sass Watcher の設定

4. scss(sass)ファイルをウォッチしてどれかに変更があればコンパイルするようにする

添付ファイル1
添付ファイル2
添付ファイル3
No.2117
07/22 12:59

edit

添付ファイル