Js-beautify: CSSルール間に空行を追加または保持する

作成日 2014年05月20日 · 16コメント · ソース: beautify-web/js-beautify

これが以前に尋ねられた場合は許してくださいが、フォーマット時にCSSルール間の間隔を保つ方法はありますか？

.login {
    margin-top: 30px;
    padding: 30px;
    background: rgba(255, 255, 255, 0.7);
}

.login.btn {
    border-radius: 0;
    background-color: #5C6166;
    border-color: #4a4a4a;
}

に：

.login {
    margin-top: 30px;
    padding: 30px;
    background: rgba(255, 255, 255, 0.7);
}
.login.btn {
    border-radius: 0;
    background-color: #5C6166;
    border-color: #4a4a4a;
}

css enhancement

ソース

drewhamlett

👍5

最も参考になるコメント

これはとても素晴らしいでしょう。 js-beautifyがsass-lintもっと明確に従っていることを望みますが、これが私に多くの問題を引き起こしている唯一の機能です。

ciel 2017年09月22日

👍4

全てのコメント16件

noducks 2014年07月02日

ThanosSamarinas 2014年07月13日

redrbrt 2014年08月07日

「end_with_newline」というオプションがあります。これによりブロック間に新しい行が追加されると思いましたが、ファイルの最後に空の行を配置するだけです：-/

これが修正されることを願っています。私はbeautifyが大好きですが、この問題（これはばかげているように聞こえるかもしれません）は私にとって大きな問題です。

Atid-Gharbi 2014年08月16日

少なくとも単純なCSSドキュメントの場合は、}ごとに新しい行を追加することでこれを修正しました。

\ Packages \ HTML-CSS-JS Prettify \ scripts \ node_modules \ js-beautify \ js \ lib \ beautify-css.jsに移動します
コードの次のセクションを見つけます。

print["}"] = function (ch) {
            print.newLine();
            output.push(ch);
            print.newLine();
        };

に変更します

print["}"] = function (ch) {
            print.newLine();
            output.push(ch);
            print.newLine();
            output.push('\n');
        };

Atid-Gharbi 2014年08月16日

@ Atid-G、それは素晴らしいです！テスト（およびPythonポート）を含むプルリクエストを提供してください。

bitwiseman 2014年09月30日

@ Atid-Gからの修正では不十分だと思います。ネストされたプロパティでは、閉じ括弧の後に改行を追加する必要はありません。私はそれがless / scssのためであることを知っています、しかし私はこれがthos言語を美化するためにも使われると思います。

例：

.rule-1 {
    display: block;

    .rule-2 {
        float: left;
    } // New line needed after this bracket

    .rule-3 {
        display: none;
    } // No new line needed
}