前提・実現したいこと
LiveSassCompilerを正常に作動したいです。
VScodeのLiveSassCompilerの以下のエラーの解決方法がわかりません
お分かりになる方いらっしゃいましたらご教授お願い致します。
発生している問題・エラーメッセージ
cssファイルが出力されません
エラーメッセージ
Compilation Error
Error: semicolons aren't allowed in the indented syntax.
╷
1 │ $blue: #3bbfce;
│ ^
該当のソースコード
jsonは以下のように設定しています。 "liveSassCompile.settings.formats": [ // Sassの出力方法の設定 { "format": "expanded", // expanded / nested / compact / compressed の4つから選択可 "extensionName": ".css", // .css拡張子で出力 "savePath": "~/./css" // .scssファイルからの相対的な出力先のフォルダを指定 } ], "liveSassCompile.settings.autoprefix": [ // ベンダープレフィックスを付与する条件 "last 2 versions", "ie >= 11", ], "liveSassCompile.settings.excludeList": [ // 除外するファイル ".vscode/**", // ], "liveSassCompile.settings.generateMap": false // ソースマップの出力有無
試したこと
LiveSassCompilerのアンインストール
Vscodeのアンインストール
補足情報(FW/ツールのバージョンなど)
Vscode:1.60.2
LiveSassCompiler:5.1.0
該当の 箇所と ついでに その前後を コメントアウトしたら どうなりますか?
それ以降は
Expected newline
と新たなエラーが出ました。
それも含め、全てコメントアウトすると出力されました
どのようなエラーだったのでしょうか?
調べてもよく分からずすみません
おそらくは、提示されている 箇所でなく、その前に何か エラーとなる箇所があると思われます。
少しずつ コメントを はずしていって、そのエラーとなる箇所を 特定するのが、時間がかかるように見えますが、確実に問題の個所を見つけられると思います。
全てコメントアウトしないとsuccess出来ませんでした。
$の箇所はsemicolons aren't allowed in the indented syntax.
その他の要素ではExpected newline
のエラーが出てしまいます。
全く同じコードをhttps://www.sassmeister.com/でペーストしたらCSSにコンパイルできたので
しばらくそれで試すしかないでしょうか?
「Expected newline」は、改行コードの問題かもしれません。エディタによっては、改行コードが非表示なため、見た目変わらなくて 改行が違っていた可能性があります。今んとこ、問題なければ 大丈夫ですが、一行程度なにか 入力して また 表示されるようでしたら、エディタを変えた方がいいかもしれません。
非常にご丁寧なご回答ありがとうございます。
大変助かりました。
あ、そうか、VSCode でしたね。右下に 文字コード 改行コードが 書かれていますので、確認できますね。解決したのであれば、自己解決方法を 記述して、「解決済」にしてください。
すみません。
まだ解決はできていません。
行末の;を消したり,に変換するとErrorは消えますが、相変わらず、コンパイルされません。
また、{}を消すことでもErrorが消えます。
エディエタの変更を考えてみます。
「LiveSassCompiler」をインストールしているならば、右下に「LiveSassCompiler」の状態が表示されていると思います。「Watching」になっていますか?それとも「Watch Sass」になっていますか?クリックで 入れ替わります。「Watching」になっていれば、拡張子「scss」のファイルを保存すると、自動的にコンパイルが 動作する さまが 出力ビューに表示されるはずです。
Watch Sass をクリックすると一瞬Errorが表示され、Wathingになります。
Error内容は、括弧を消したり、,;を消したりを指示しているみたいです。
コンパイルはされません。
コンパイル対象の Sass ファイルの、ファイル名をご提示いただけますか?
お二方ありがとうございます!!!
sassファイル名をscssに変更し、Error該当箇所を指示通り変更したら
successできました。
本当にありがとうございます。
ご解決されて何よりです。
回答1件
あなたの回答
tips
プレビュー