現在 Parcel 2.8.3 と @parcel/transformer-sass 2.8.3 を使用していますが、メディア クエリの書き換え方法にいくつか問題があります。 Parcel を使用した以前のプロジェクトでは、そのような問題は発生せず、すべてが順調でした。

これは SASS ファイルです:

h1 { 赤色; } @media のみの画面と (最大幅: 40em) { h1 { 青色; } }

これは CSS 出力です:

h1 { 赤色; } @media のみの画面と (幅 <= 40em) { h1 { 色: #00f; } }

ご覧のとおり、CSS ファイル内のメディア クエリは max-width から width <= 40em に変更されていますが、実際の携帯電話で表示すると機能しません。

1 か月前のプロジェクトからコピーした package-lock.json と package.json を使用すると、メディア クエリが正常に書き換えられます。上に示したように、新しいプロジェクトに対して npm i Parcel & npm i @parcel/transformer-sass を実行すると、プロジェクトを起動すると、すべてのメディア クエリが、表示されている 2 番目のコード ブロックのように変更されます。何かご提案があれば幸いです。