sassのエラー

DreamweaverのSCSS(SASS)で@importを使用時エラーになる原因と回避方法

エラーの原因

Dream Weaver CCではコンパイラソフトを使用せずに、
SASS(SCSS)ファイルを自動でコンパイルしてくれる機能が備わりました。

しかし、@importタグを使うと、
エラーが起こってしまう不具合?があります。

原因は、どうやらサイトの管理で使用するフォルダ名に日本語が混ざっていると、
エラーが起こるようです。

 

エラーが起こる場合の例

以下のように適当に「ほげほげ」というフォルダに、
サイトで使うファイル一式を格納し、
そのフォルダをサイトの管理で指定するとします。

step1

例として、下記のように、
_hoge.scssファイルをstyle.scssでインポートするように指定します。

 

_hoge.scssの中身に適当なCSSを記載します。

そして、style.scssをコンパイルすると、以下のようにエラーになってします。

このエラーは、Dream Weaverのバグであるかどうかは不明です。

エラーが起こらないようにするには

エラーが起こらないようにするには、
フォルダ名を「半角英数」にすることです。

以下のようにサイトの管理で「ほげほげ」というフォルダ名を「hoge」に変更します。

そして、style.scssをコンパイルすると。。。

 

 

ちゃんと出来ました。

 

以上のように、ホルダ名を「半角英数」にすれば、
エラーが解消されます。

エラーが起こる場合は、
サイトの管理で指定しているフォルダに「日本語」が混ざっていないか、
確認しましょう。

投稿者:

kishiken

企業務めのWEBデザイナーです。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です