SCSSの「Error: Invalid Windows-31J character “\xE3″」というエラーの回避法

Dreamweaver

SCSSを使っていて、エラーでつまづいたお話。

同じエラーで苦しんでいる人がいたら役立ちたい。自分はこれで30分くらい無駄にしました(T_T)

SCSSを使ってると、コンパイルエラーが出る事がありますよね。
この「Error: Invalid Windows-31J character “\xE3″」というエラーもコンパイル時のエラーなんですが、どうしてもこのエラーが回避できずに困っておりました。
エラーの意味がわかってもなかなか改善できなかったのです(T_T)

今回はこのエラーの原因と回避策。

Invalid Windows-31J character “\xE3″ってなんじゃい!!

調べてみたところ、文字コードWindows-31J(Shift-JISの拡張版みたいなやつ)が無効っすみたいなエラーのようです。

ファイル内に日本語があり、エンコードの指定が無い時に出るようですね。

回避策は?

ここだけ見れば非常に簡単。
エンコードの指定を入れてあげれば良いんです。

@charset "utf-8";

これだけ。
なんだ!!めっさ簡単♪と思い、すぐにファイルを修正。

//テスト。
html{
}

これに、エンコード指定を入れましょう。

@charset "utf-8";
//テスト。
html{
}

これで、だいたいの方はエラー解消できたと思います。
まだエラーが出ている人は、自分と同じ状況かもしれないので続きを読んでくださいm(__)m

エラーが消えない!って場合は。

もしかして、Dreamweaver使ってませんか!?
自分はそれでだいぶハマりました。

ソースを一回全部見直してみましょう。

/* Scss Document */
@charset "utf-8";
//テスト。
html{
}

こんな事になってませんか??

1行目、なんか入ってますよね・・・?
Dreamweaverでは、SCSSファイルを新規で作成した場合、必ず1行目に「/* Scss Document */」というテキストが入ります。
んで、その下からソースを書いていたので、エンコード指定もその下に入れていました。
それが問題だったようです。

@charset "utf-8";
//テスト。
html{
}

元々入っている「/* Scss Document */」を消す!もしくは、2行目の@charset “utf-8”;を、このテキストの上に持ってくる!
これで回避できました!!

さいごに

なんでコメントアウトしてて、しかもアルファベットなのにその下にエンコードの指定を入れてもエラーが回避できないのか、そこはさっぱりわかりません。
が、とりあえずエンコード指定はファイルの一番最初に持ってこないといけないみたいですね。勉強なりました。

Dreamweaver、アップデート後SCSSに対応したりGit使えたりエディタにBracketsが採用されたりと、かなり使いやすく、しかも軽くなってます。
なのでもうほぼDreamweaverを使ってサイトの制作はしているのですが、こういう痒いトコにまだ手が届かない時があります(T_T)

いらんやん、この1行・・・無しにしてくれたら良いのに・・・
設定で無しにできたりするのかな?ちょっと勉強してみます。もし誰か知っている方がいれば教えてくださいm(__)m

でも、全てひっくるめてDreamweaverはかなり使いやすくなっていて便利です!

この記事を書いた人

うぇぶめも。運営者のたきおです。
ジョギング・草野球が趣味のクセにぽっちゃり体型。

自分の備忘録も兼ねて、ウェブ系のちょっとした情報などを発信しております。
気に入ってもらえればTwitter・Facebookなどでもフォローして頂けると励みになりますm(__)m

フォローしてくれると、うれしい。

ブログランキングに参加しました!
応援宜しくお願いします!!

にほんブログ村 IT技術ブログへ

Dreamweaver
フォローしてくれると、うれしい。
うぇぶめも。

コメント