Parcel tersilap menulis semula pertanyaan media

Question

Saya sedang menggunakan Parcel 2.8.3 dan @parcel/transformer-sass 2.8.3, tetapi saya menghadapi beberapa masalah dengan cara saya menulis semula pertanyaan media. Dalam projek saya sebelum ini menggunakan Parcel, saya tidak mempunyai masalah sedemikian dan semuanya adalah seperti yang sepatutnya.

Ini ialah fail SASS:

h1 {
  warna: merah;
}

@media sahaja skrin dan (lebar maksimum: 40em) {
  h1 {
    warna: biru;
  }
}

Ini ialah output CSS:

h1 {
  warna: merah;
}

@media sahaja skrin dan (lebar <= 40em) {
  h1 {
    warna: #00f;
  }
}

Seperti yang anda boleh lihat, pertanyaan media dalam fail CSS telah ditukar daripada lebar maksimum kepada lebar <= 40em, yang tidak berfungsi apabila dilihat pada telefon mudah alih sebenar.

Jika saya menggunakan package-lock.json dan package.json yang disalin daripada projek berusia 1 bulan, pertanyaan media akan ditulis semula sebagaimana yang sepatutnya. Seperti yang ditunjukkan di atas, apabila menjalankan npm i Parcel & npm i @parcel/transformer-sass untuk projek baharu saya, apabila saya melancarkan projek, semua pertanyaan media berubah seperti dalam blok kod kedua yang ditunjukkan. Sebarang cadangan adalah bagus.

Answer 1

Saya menemui penyelesaian untuk melanjutkan senarai penyemak imbas. Tambahkan yang berikut pada package.json anda:

"browserslist": "> 0.5%, last 3 versions, not dead"

Ini akan memanjangkan penyemak imbas yang disokong dan harus memastikan ia tidak ditimpa dan safari lama boleh mengendalikannya.