css - スタイラスペンは有効なCSSでは機能しません

Question

私がスタイラスを使用していたコンパイルの理由の1つは、スタイラスファイルの通常のcssで動作できることです（したがって、すべてを一度に変換する代わりに、必要に応じて変換できます）が、それは真実ではないようです。次の.stylファイル：

.page-wrap
{
    min-height: 300px;
    font-size: 1.4em;
    line-height: 1;
    min-width: 940px;
    max-width: 1170px;
    margin: 0 auto;
}

この.cssファイルにコンパイルします。

.page-wrap,
{
  min-height: 300px;
  font-size: 1.4em;
  line-height: 1;
  min-width: 940px;
  max-width: 1170px;
  margin: 0 auto;
}

セレクターの最後にある余分なコンマは無効です。

スタイラスは通常のCSSで動作するはずではありませんか、それともこれはバグですか（npmの最新バージョンを使用しています）？

score 4 · Accepted Answer

それは実際にはバグではありません。セレクターと同じ行にオープニングカーリーブレースを入れれば消えると思います。

スタイラスはコンマやセミコロンなどを使用しないコードの記述もサポートしているため、これを行っていると思います。したがって、次の行に別のセレクターを追加することを示すものとして、中括弧が開いていない行を理解します。したがって、コンマを挿入します。あなたのために

score 2 · Accepted Answer

score 0 · Accepted Answer

スタイラスペンは{}タグを使用しません。{}を使用する必要はありません。例：

.page-wrap,
    min-height: 300px;
    font-size: 1.4em;
    line-height: 1;
    min-width: 940px;
    max-width: 1170px;
    margin: 0 auto;

score 0 · Accepted Answer

.page-wrap
{
    min-height: 300px;
    font-size: 1.4em;
    line-height: 1;
    min-width: 940px;
    max-width: 1170px;
    margin: 0 auto;
}

生産する

.page-wrap {
    min-height: 300px;
    font-size: 1.4em;
    line-height: 1;
    min-width: 940px;
    max-width: 1170px;
    margin: 0 auto;
}

4 に答える 4