css - Grunt Sass コンパイルの問題

Question

grunt によってコンパイルされている main.css にすべての sass ファイルがあります。

構造は次のとおりです。

---

main.scss

/* Extended CSS */
@import '_extend.scss';

/* Generic CSS */
@import 'general.scss';

/* View based CSS */
@import 'create-obj.scss';
@import 'css2.scss';

/* Module based CSS **/
@import 'css3.scss';

---

_extend.scss

%width-100 {
    width: 100%;
}

---

create-obj.scss

ul.form-fields {
> li {
    @extend %width-100;
    @extend %float-l;
    position: relative;
    input {
        padding-right: 160px;
    }
}
}

---

grunt によってコンパイルされているときに、次のエラーが発生します。

Running "compass:server" (compass) task
error src/main/webapp/assets/scss/create-obj.scss (Line 14: "ul.form-fields > li" failed to @extend "%width-100".
The selector "%width-100" was not found.
Use "@extend %width-100 !optional" if the extend should be able to fail.
)
write src/main/webapp/assets/css/main.css (0.049s)
Compilation failed in 1 files.
Warning: ↑ Use --force to continue.

警告のため中止されました。

---

そして、_extend.scss を再保存すると、成功します。

---

一言で言えば、css1.scss に css を追加して保存するたびに。Grunt でコンパイル エラーが発生し、_extend.scss を保存してコンパイルを完了する必要があります。

---

フィードバックをお待ちしております。