[VSCode]Visual Studio CodeでSassをコンパイルする方法の覚書

あらかじめ、NPM、Node.jsをインストールしておきます。

（１）. VS Codeを開き、Shift＋Command＋P　ショートカットで「コマンドパレット」を開きます。
（２）. Configure Task Runnerと入力して、Enterで選択します。
（３）. 次に表示される画面で「Others」を選択します。
（４）. 以下の内容を記入したサンプルの「tasks.json」ファイルを「.vscode」フォルダーに作成します。　　

{
    "version": "0.1.0",
    "command": "npm",
    "isShellCommand": true,
    "args": ["run"],
    "tasks": [ 
        { 
          "taskName": "build-sass",
          "isBuildCommand": true,
          "showOutput": "always"
        }
    ]
}

（５）. 次に開いているフォルダの一番上の位置に 「package.json」 というファイルを作成して、以下の内容を記述します。
site/sass/style.scss site/css/style.cssは、適宜変更して下さい。

{
  "name": "node-sass-build",
  "version": "0.1.0",
  "scripts": {
     "build-sass": "node-sass -w --source-map true site/sass/style.scss site/css/style.css"
  }
}

Shift ＋ Command ＋ B　のショートカットでコンパイルが開始されます。
一度行ったあとはscssファイルの保存の度にコンパイルされると思います。

実際に動いたあとで覚書を記入したので、うまくいかないところがあるかもしれません。。
その際は以下の２つの記事を参考にしてみてください。

参考：Visual Studio Code で Sass(scss)コンパイルを行うシンプルな方法
CSS, Sass and Lessサポート