質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.46%
SCSS

SCSSは、SassのCSSメタ言語です。Webページのスタイルを指定するCSSを効率的に記述することができます。ネストと呼ばれる入れ子構造で記述するため、CSSの全体の記述量を減らせる点が特徴です。さらに変数も利用できるため、変更や修正の際に少ない作業量で対応することもできます。

コンパイルエラー

コンパイルのフェーズで生成されるエラーです。よく無効なシンタックスやタイプが含まれているとき発生します。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

0回答

1413閲覧

VSC live sass compiler コンパイルエラーの解決方法

ProgramASMR

総合スコア0

SCSS

SCSSは、SassのCSSメタ言語です。Webページのスタイルを指定するCSSを効率的に記述することができます。ネストと呼ばれる入れ子構造で記述するため、CSSの全体の記述量を減らせる点が特徴です。さらに変数も利用できるため、変更や修正の際に少ない作業量で対応することもできます。

コンパイルエラー

コンパイルのフェーズで生成されるエラーです。よく無効なシンタックスやタイプが含まれているとき発生します。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2021/09/05 09:29

VSC live sass compiler コンパイルエラーについて

VSCプラグインのLive sass compilerを使用してscssファイルのコンパイルを行いたいのですが、
@importがうまくいかず、コンパイルできません。
過去に同様の質問がいくつかあるのは確認しているのですが、
どれを試しても解決しません。(プラグインの無効化、改行をいれる、等)
もしご知見があるかたがいらっしゃいましたら、解決方法をお教えいただくことはできますでしょうか。

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

Compilation Error
Error: File "c:\Users" not found
on line 3 of sass/c:\Users
from line 3 of sass/c:\Users
@import "mixin/_mixin";
--------^

該当のソースコード (styles.scss)

scss

1@charset "utf-8"; 2 3@import "base/base"; 4 5@import "mixin/mixin"; 6 7@import "module/footer"; 8 9@import "module/header"; 10 11@import "page/top/top-mv"; 12 13@import "page/top/top-products"; 14 15@import "page/top/top-about-us"; 16 17@import "page/top/top-news"; 18 19@import "page/top/top-contact"; 20 21@import "page/sub/product"; 22 23@import "page/sub/news"; 24 25@import "page/sub/news-detail";

ディレクトリ構成

scss/styles.scss

scss/base/base.scss

その他上記ソースコード参照いただければと思います。
こちらのディレクトリ構成に間違いはないと思います。

試したこと

各種プラグインの無効化、再起動、改行の挿入等

※使用しているプラグイン
Auto Rename Tag
Bracket Pair Colorizer
CSS Peek
CSSTree validator
HTML CSS
HTMLHINT
indent-rainbow
Japanese-Language pack for visual studio code
live sass compiler
live server
live share
live share audio
live share extension pack
material icon theme
PHP intelephense
Wordpress snippet
zenkaku
highlight matching tag

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

バージョン: 1.60.0 (user setup)
コミット: e7d7e9a9348e6a8cc8c03f877d39cb72e5dfb1ff
日付: 2021-09-01T10:41:52.311Z
Electron: 13.1.8
Chrome: 91.0.4472.164
Node.js: 14.16.0
V8: 9.1.269.39-electron.0
OS: Windows_NT x64 10.0.18363

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.46%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問