<p>현재 Parcel 2.8.3 및 @parcel/transformer-sass 2.8.3을 사용하고 있지만 미디어 쿼리를 다시 작성하는 방식에 몇 가지 문제가 있습니다. Parcel을 사용한 이전 프로젝트에서는 그러한 문제가 없었고 모든 것이 예상대로였습니다. </p> <p>SASS 파일은 다음과 같습니다. </p> <pre class="brush:php;toolbar:false;">h1 { 색상: 빨간색; } @미디어 전용 화면 및 (최대 너비: 40em) { h1 { 파란색; } }</pre> <p>CSS 출력은 다음과 같습니다. </p> <pre class="brush:php;toolbar:false;">h1 { 색상: 빨간색; } @media 전용 화면 및 (너비 <= 40em) { h1 { 색상: #00f; } }</pre> <p>보시다시피 CSS 파일의 미디어 쿼리가 max-width에서 width <= 40em으로 변경되었는데, 이는 실제 휴대폰에서 볼 때 작동하지 않습니다. </p> <p>1개월 전 프로젝트에서 복사한 package-lock.json 및 package.json을 사용하면 미디어 쿼리가 예상대로 다시 작성됩니다. 위와 같이 새 프로젝트에 대해 <code> npm i Parcel & npm i @parcel/transformer-sass</code>를 실행하면 프로젝트를 시작할 때 모든 미디어 쿼리가 두 번째 코드 블록과 같이 변경됩니다. 어떤 제안이라도 좋을 것입니다. </p>