Viewport Units Bugyfill 및 purgeCSS 동시 사용 시 appendToBody 추가

단락입니다.
Viewport Units Buggyfill는 iOS Safari에서 vh 지정 스타일을 사용할 때 붕괴 등의 문제를 표시할 수 있는 프로그램 라이브러리다.
예를 들어 Vue라면 실행만 하면 실행된 페이지의 vh 문제를 수정할 수 있습니다.
onMounted(async () => {
  // iOS Safariで100vhを完璧には判定してくれない問題に対するPolyfill
  // @see https://github.com/rodneyrehm/viewport-units-buggyfill
  const viewportUtils = (await import("viewport-units-buggyfill")).default;
  viewportUtils.init();
});
단, 이를 바탕으로purgeCSS를 실행하면 본 프로그램 라이브러리를 통해 vh를 수정하는 데 사용되는 스타일을 제거할 수 있을 것 같습니다.
※ 행동기준만 확인했습니다.엄격한 공장 검사는 이뤄지지 않았다.탓하지 마세요.
따라서 바디 탭에 다음과 같은 스타일을 삽입하는 옵션{ appendToBody: true }을 지정하여 해결할 수 있습니다.
onMounted(async () => {
  // iOS Safariで100vhを完璧には判定してくれない問題に対するPolyfill
  // @see https://github.com/rodneyrehm/viewport-units-buggyfill
  const viewportUtils = (await import("viewport-units-buggyfill")).default;
  viewportUtils.init({ appendToBody: true });
});

좋은 웹페이지 즐겨찾기