Js-beautify: newline_between_rulesがSassをサポート（拡張）

そして、あなたはそれをどのように見せたいですか？

CSSバージョンと同様https://github.com/beautify-web/js-beautify/pull/574
一般に、1つのネストレベルで十分です。
ここに例があります：

// Icons
.icons {
  padding: 0;

  li {
    display: inline-block;
  }

  a {
    display: block;
    color: #000;
  }

  a:hover {
    color: #ccc;
  }
}

// Button
.button {
  &.primary {
    color: #4183c4;
  }

  &.primary:hover {
    color: lighten(#4183c4, 15%);
  }
}

こんにちは、
これはscssルールの作業ですか。

。古い価格 {
@include GibsonRegular（）;
@include font-size（14）;
色：＃646464;
マージン左：10px;
テキスト装飾：ラインスルー;

.promovalue {
  <strong i="15">@include</strong> GibsonRegular();
}

}

+1

+1

+1

+1

newline_between_nested_rules: trueようなオプションは、特にネストされた問題のように思われるのでしょうか。

}と;は、ネストされた新しい行のルールを考慮する必要があります

+1、これも少ない

+1

+1

これは、ネストされたルールでのみ問題になることを確認できます。 現在newline_between_rules: trueこれ：

body {
  background-color: #FFF;

  > div {
    background-color: #AAA;
  }
}

.container {
  color: blue;
}

これになります：

body {
  background-color: #FFF;
  > div {
    background-color: #AAA;
  }
}

.container {
  color: blue;
}

そしてnewline_between_rules: falseこれは結果です：

body {
  background-color: #FFF;
  > div {
    background-color: #AAA;
  }
}
.container {
  color: blue;
}

したがって、ネストされたルール間の改行のサポートを検討する必要があります。

+1

このことに関するETAはありますか？

+1

+1

+1 :(

+1

別の+1

騒音でごめんなさい。 これに賛成する別の方法があるかどうかはわかりませんでした。

@zimmerboyすべてのコメントの右上に、+ 1リアクション（：+ 1 :)を含む[リアクションを追加]ボタンがあります。

beautify-css.js私の回避策：

1. newLine関数を置き換えます。

        print.newLine = function(keepWhitespace, keepNewLine) {
            if (output.length) {
                if (!keepWhitespace && output[output.length - 1] !== '\n') {
                    print.trim();
                    if (keepNewLine) { output.push('\n'); }
                }

                output.push('\n');

                if (basebaseIndentString) {
                    output.push(basebaseIndentString);
                }
            }
        };

1. newline_between_rules条件とステートメントの両方を次のように変更します。

                    if (newline_between_rules) {
                        print.newLine(false, true);
                    }

注：これは、プロパティの後のルールではなく、ルール間の改行のみを処理します。 誰かそれについてのアイデアはありますか？

@ sickboy-かっこいい、プルリクエストを開始し、いくつかのテストを追加します。 お気軽にどうぞ。

これはもうすぐ来るのですか？ これは、sassにbeautifyを使用するための私の唯一のブロッカーです。

@ mrahhal-この問題は2年近く前のものです。 @sickboyはこれについていくつかの作業を行っています。 誰かがテストでプルリクエストを行う必要があります。

多分あなたはこれをしたいですか？ CONTRIBUTING.mdを参照してください。

@bitwiseman残念ながら、私はこの種のプロジェクトの経験も時間もありません。 しかし、私の質問は、誰もがプレーンなcssを使用しているのか、それとも現在のフォーマットがどのように機能するかに固執しているのかということです。 これは非常に古いが解決しやすい問題にとっては奇妙なことです。

@sickboyあなたはこれにいますか？ 誰もこれに積極的に取り組んでいないのなら、結局私はそれに取り組むでしょう。 「max_preserve_newlines」の奇妙な動作は別として、これが、私がbeautifyを使用することを完全に妨げている唯一の欠落していることです。

プルリクエスト＃1117（ cssにpreserve_newlinesを追加）がこれに役立つかどうか疑問に思います。

@zimmerboyはい、それは現在の問題の修正のようですが、私は別の種類だと思います。

＃1117はマージされますか？この問題にも対処しているようです。

@ jorgeramirez-以前のフィードバックの修正を待っています。

@bitwiseman素晴らしい！

更新はありますか？

@ royduin-最新リリースでテストしてください。

正常に動作しているようですが、コメントに少し問題があります。 Bootstrap SCSSは良い例ではないことは知っていますが、それでもなおです。

これは、リポジトリでのコードのフォーマット方法です。

そしてこれは美化した後です：

期待どおりに機能しますが、コメントは前の宣言と重複していますが、コメントが正しくフォーマットされている場合は、正常に機能します。

繰り返しますが、それは本当に重要なことではありませんが、Bootstrapは広く使用されています：confused：

@stgogm
新しい問題を提出してください。
また、画像ではなくテキストを含めてください。

@bitwisemanわかりました、ごめんなさい。 SCSSリンタールールを尊重すれば、それは実際には問題ではないので、注意したかっただけです。

@ stgogm-かっこいい、情報をありがとう。 😄

@stgogmを設定しているときに、ネストされたnewline_between_rules問題をテストできますか？ と

newline_between_rules: true

あなたは

fieldset {
    border: 0;
    margin: 0;
    min-width: 0;
    padding: 0;
    &+fieldset {
        margin-top: $padding-large;
    }
}

なる

fieldset {
    border: 0;
    margin: 0;
    min-width: 0;
    padding: 0;

    &+fieldset {
        margin-top: $padding-large;
    }
}

？

実際には、違いはありません。

作成されたコード（間に改行なし）：

form {
  display: block;
}

fieldset {
  border: 0;
  margin: 0;
  min-width: 0;
  padding: 0;
  & + fieldset {
    margin-top: $padding-large;
  }
}

"newline_between_rules": false美化した後：

form {
  display: block;
}

fieldset {
  border: 0;
  margin: 0;
  min-width: 0;
  padding: 0;
  &+fieldset {
    margin-top: $padding-large;
  }
}

"newline_between_rules": true美化した後：

form {
  display: block;
}

fieldset {
  border: 0;
  margin: 0;
  min-width: 0;
  padding: 0;
  &+fieldset {
    margin-top: $padding-large;
  }
}

+間のスペースを削除しただけです。

js-beautify --version
1.6.12

ありがとう@stgogm！ だからいいえ@ bitwiseman ＃1146はこれを修正しませんでした

「newline_between_rules」がSCSSに十分でない別の例：

$variable: #333;
div {
  display: none;
}

このSCSSをフォーマットしても、変数とdivセレクターの間に改行は追加されません。

この機能がいつ利用可能になるかは明確ですか？

何か進展はありますか？

@ dehghani-mehdi @whxaxes
この機能は割り当てられていません。 それを実装してテストを追加する誰かが必要です。

+1

+1

+1

+1

+1

+1メッセージではなく、最初の投稿に対する👍反応で投票してください。これにより、サブスクライバーにスパムが送信されることはありません。 ありがとう！