前提・実現したいこと
VScodeの拡張機能『Easy Sass』もしくは『Live Sass compiler』で
@importを使用しているファイルのみをコンパイルしたいです。
フロントの開発でVScodeを使用し始めたのですが、SassのコンパイルにLive Sass compilerを使用しています。
index.scssに集約する形でパーシャルファイルをよく使用するのですが、
index.scssを毎回更新しないとcssを更新してくれないので少し手間を感じています。
_base.scssなどのパーシャルファイルを更新したらindex.scssも自動で更新するように設定をしたいと思っているのですが、こちらは可能なのでしょうか?
Live Sass compilerではできなくてもEasy Sassの設定でできるなどあればそちらでも大丈夫です。
お手数をおかけしますがよろしくお願いします。
試したこと
Live Sass compilerでは『liveSassCompile.settings.includeItems』で該当の設定ができるかなと思い、
下記のように設定してみたのですが無反応でした。。
Easy Sassでは同様の設定を見つけられませんでした。
"liveSassCompile.settings.includeItems": [ "/assets/scss/index.scss" ]
上記に対するディレクトリ構造は下記です。
test - index.html - assets - scss - index.scss - modules - _base.scss
assetsの直下に.cssのファイルがコンパイルされる想定です。
よろしくお願いします。
###補足
ご回答頂きありがとうございます。
SCSSファイルの内容となります。
/assets/scss/index.scss
@import "./modules/base";
/assets/scss/modules/_base.scss
body { // 各種設定 }
settings.json
"liveSassCompile.settings.generateMap": false, "liveSassCompile.settings.formats": [ { "format": "expanded", "extensionName": ".css", "savePath": "~/../" } ], "liveSassCompile.settings.autoprefix": [ "> 1%", "last 2 versions", "Firefox ESR", "ie 8", "ie 9" ], "liveSassCompile.settings.includeItems": [ "/assets/scss/index.scss" ]
/assets/scss/index.scssを更新すればコンパイルできているのですが、_base.scssを更新してもindex.scssが自動でコンパイルされないので、毎回index.scss内で改行して戻して・・という作業をすることでコンパイルしています。
回答1件
あなたの回答
tips
プレビュー