Js-beautify: dukungan newline_between_rules untuk Sass (peningkatan)

Dan Anda ingin tampilannya seperti apa?

Mirip dengan versi CSS https://github.com/beautify-web/js-beautify/pull/574
Secara umum, satu level bersarang sudah cukup.
Berikut contoh:

// 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%);
  }
}

Hai,
Apakah ini berfungsi untuk aturan scss.

.harga lama {
@include GibsonRegular();
@include font-size(14);
warna: #646464;
margin-kiri: 10px;
dekorasi teks: line-through;

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

}

+1

+1

+1

+1

mungkin opsi seperti newline_between_nested_rules: true karena tampaknya secara khusus merupakan masalah dengan bersarang?

} dan ; perlu mempertimbangkan aturan untuk baris baru bersarang

+1, juga lebih murah

+1

+1

Saya dapat mengonfirmasi bahwa ini memang masalah hanya dengan aturan bersarang. Saat ini dengan newline_between_rules: true ini:

body {
  background-color: #FFF;

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

.container {
  color: blue;
}

Menjadi ini:

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

.container {
  color: blue;
}

Dan newline_between_rules: false inilah hasilnya:

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

Jadi dukungan untuk baris baru di antara aturan bersarang harus dipertimbangkan.

+1

Setiap ETA pada hal ini?

+1

+1

+1 :(

+1

+1 lainnya

Maaf untuk kebisingan. Saya tidak tahu apakah cara lain untuk meningkatkan ini.

@zimmerboy ada tombol "Tambahkan reaksi Anda" di kanan atas setiap komentar, yang berisi reaksi +1 (:+1 :).

Solusi saya di beautify-css.js :

1. Ganti fungsi baris baru:

        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. Ubah kedua kondisi dan pernyataan newline_between_rules menjadi:

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

Catatan: Ini hanya menangani baris baru di antara aturan, bukan aturan setelah properti. Adakah yang punya ide tentang itu?

@sickboy - Keren, mulai permintaan tarik, tambahkan beberapa tes. Silakan lanjutkan ini.

Apakah ini akan datang dalam waktu dekat? Ini satu-satunya pemblokir saya untuk menggunakan beautify untuk sass.

@mrahhal - Masalahnya hampir dua tahun. Tampaknya @sickboy telah melakukan beberapa pekerjaan untuk ini. Seseorang hanya perlu membuat permintaan tarik dengan tes.

Mungkin Anda ingin melakukan ini? Lihat KONTRIBUSI.md .

@bitwiseman sayangnya saya tidak memiliki pengalaman dengan proyek atau waktu semacam ini. Tapi pertanyaan saya adalah, jadi apakah semua orang menggunakan css biasa atau hanya mengikuti cara kerja pemformatan saat ini? Itu aneh untuk masalah yang sangat tua tetapi mudah dipecahkan.

@sickboy apakah Anda dalam hal ini? Mungkin saya akan mengatasinya jika tidak ada yang aktif dalam hal ini. Terlepas dari beberapa perilaku aneh dengan "max_preserve_newlines", ini benar-benar satu-satunya hal yang hilang yang sepenuhnya mencegah saya menggunakan beautify.

Saya ingin tahu apakah pull request #1117 ( ditambahkan melestarikan_newlines untuk css ) akan membantu dengan ini.

@zimmerboy ya itu sepertinya merupakan perbaikan untuk masalah saat ini, tetapi jenis yang berbeda menurut saya.

Apakah #1117 akan digabung? Tampaknya untuk mengatasi masalah ini juga.

@jorgeramirez - Hanya menunggu perbaikan umpan balik sebelumnya.

@bitwiseman hebat!

Ada pembaruan?

@royduin - silakan uji dengan rilis terbaru.

Tampaknya berfungsi dengan baik tetapi ada sedikit masalah dengan komentar. Saya tahu Bootstrap SCSS bukan contoh yang bagus, tapi tetap saja.

Ini adalah bagaimana kode diformat pada repo:

Dan ini setelah mempercantik:

Ini berfungsi seperti yang diharapkan tetapi komentar tumpang tindih dengan deklarasi sebelumnya, tetapi jika komentar diformat dengan benar, itu berfungsi dengan baik:

Sekali lagi, itu tidak terlalu penting, tetapi Bootstrap banyak digunakan :confused:

@stgogm
Silakan ajukan masalah baru.
Juga, harap sertakan teks, bukan gambar.

@bitwiseman Oke, maaf. Hanya ingin dicatat bahwa itu tidak benar-benar menjadi masalah jika Anda menghormati aturan linter SCSS.

@stgogm - Keren, terima kasih atas infonya. 😄.

@stgogm saat Anda mengaturnya, dapatkah Anda menguji masalah newline_between_rules bersarang? Dengan

newline_between_rules: true

apakah kamu

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

menjadi

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

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

?

Sebenarnya, tidak ada bedanya:

Kode seperti yang ditulis (tanpa baris baru di antaranya):

form {
  display: block;
}

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

Setelah mempercantik dengan "newline_between_rules": false :

form {
  display: block;
}

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

Setelah mempercantik dengan "newline_between_rules": true :

form {
  display: block;
}

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

Itu baru saja menghapus ruang antara + .

js-beautify --version
1.6.12

Terima kasih @stgogm! Jadi tidak @bitwiseman #1146 tidak memperbaiki ini

Contoh lain di mana "newline_between_rules" tidak cukup untuk SCSS:

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

Memformat SCSS ini tidak menambahkan baris baru antara variabel dan pemilih div.

Apakah sudah jelas kapan fitur ini akan tersedia?

Apakah ada kemajuan?

@dehghani-mehdi @whxaxes
Fitur ini tidak ditetapkan. Dibutuhkan seseorang untuk mengimplementasikannya dan menambahkan tes.

+1

+1

+1

+1

+1

Harap beri suara dengan reaksi 👍 ke pos awal alih-alih pesan +1 - yang tidak akan mengirim spam ke pelanggan. Terima kasih!