VS codeで、Live Sass Compilerによる.scssファイルのコンパイルができません。

前提・実現したいこと

VS codeで、Live Sass Compilerによる.scssファイルのコンパイルをする

発生している問題・エラーメッセージ

以下の手順を試みました。

１.　.scss形式でファイルを作成する
２.　Live Sass Compilerをインストールする
３.　作成した.scssファイルを開いた状態で画面下の青いバーの「Watch Sass」をクリックする

私が参考にした情報では、この手順で、作成したscssファイルの記述を反映したcssファイルが出力されるのですが、実際は画面下半分に以下のような記述が出てcssファイルが出力されません。

そもそも手順が間違っているのか、それともさらに手順が必要なのかもわからずどうしたらよいかわかりません。
解決方法をご存知の方がいましたら教えてくださると幸いです。

![イメージ説明](f4a435af64620e16c013036c55abc591.png)

該当のソースコード

ソースコード

試したこと

ここに問題に対して試したことを記載してください。

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

行動規範の内容に同意します

回答1件

実際は画面下半分に以下のような記述が出てcssファイルが出力されません。

画像(Markdown中に入れるとリンクにならないので、```で囲まれた部分の外側に出してください)を見てみました。

OUTPUT(出力)に表示されているように、styles.scssからstyles.cssが生成されていますね。つまり、Live Sass Compiler起動時のコンパイルは行なわれています。この後は監視状態になり、styles.scssを上書き保存すると自動的にコンパイルが行なわれるはずですが、それはこの画像からは確認できません。

何によって「cssファイルが出力されません」という判断を行なったのかわかりませんが、Live Sass Compilerは、生成したCSSファイルを自動的にエディターで開いたりはしません。ただ生成するだけです。内容を確認したければ、左側にエクスプローラーバー(ファイル一覧)を表示させ、ご自分でCSSファイルをクリックするなどしてください。

投稿2021/03/07 14:14