VSCodeでSassをコンパイル（Live Sass Compiler）

Live Sass Compiler を使用する

動かなかったら「Watch SASS」をクリックする。

ドキュメント

https://github.com/glenn2223/vscode-live-sass-compiler/blob/HEAD/docs/settings.md

settings.json

Watch

VSCode起動後に自動でWatchsさせるか

"liveSassCompile.settings.watchOnLaunch":  true/false,

ソースマップ

"liveSassCompile.settings.generateMap": true/false,

ベンダープレフィックス

//autoprefix無し
"liveSassCompile.settings.autoprefix": false,

//指定する場合
"liveSassCompile.settings.autoprefix": [
	"> 3% in JP",
	"last 2 versions"
],

出力ファイル名やパス

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

設定例まとめ

	"liveSassCompile.settings.generateMap": false,
	"liveSassCompile.settings.autoprefix": false,
	"liveSassCompile.settings.formats": [
		{
		"format": "expanded",
		"extensionName": ".css",
		"savePath": "/assets/css",
		},
	],
	"liveSassCompile.settings.watchOnLaunch": true,