Microsoft Student (2023)728x90
728x90
Console Error Attempting to parse an unsupported color function "lab" 문제 해결 방법 (html2canvas)
들어가며
- Next.js와 TailwindCSS를 이용하여 개발할 때, @html2canvas@ 라이브러리를 이용하여 웹피이지를 이미지 파일로 저장하는 기능을 구현하려고 할 때, 다음과 같이 @lab()@ 관련 오류가 발생할 수 있다.
Console Error Attempting to parse an unsupported color function "lab"
Call Stack 10 Show 10 ignore-listed frame(s)- 이때 이 문제를 해결하는 방법을 간단하게 정리해본다.
해결 방법
- 이 문제는 TailwindCSS / PostCSS 환경에서 CSS Color Module Level 4의 @lab()@ 색상 함수를 아직 제대로 지원하지 못해서 발생하는 오류라고 한다.
- 해결 방법은 간단하다.
- @htm2canvas-pro@를 설치한 후 @htm2canvas@ 대신 사용한다.
$ npm install html2canvas-pro
참고 사이트
Solved html2canvas error with html2canvas-pro fork | Saneesh N님이 토픽에 대해 올림 | LinkedIn
For the past few days, I was stuck with a frustrating error while trying to use html2canvas to capture my Next.js project. The error: ❌ Uncaught Error: Attempting to parse an unsupported color function "oklch" No matter what I tried — changing styles,
www.linkedin.com
728x90
728x90
'Framework > Next.js' 카테고리의 다른 글
| [Next.js] Google Sheets API 연동 방법 (0) | 2025.07.06 |
|---|---|
| [Next.js] 같은 네트워크 망에 연결된 다른 컴퓨터에서 테스트 하는 방법 (0) | 2025.06.08 |
| [Next.js] <Link> 컴포넌트 클릭 시, 최상단으로 스크롤 되는 현상 막는 방법 (0) | 2024.12.20 |
| [Next.js] Hydration 에러 해결하는 방법 (Next.js 15) (0) | 2024.11.21 |
| [Next.js] 렌더링 방식 정리 (CSR(Client Side Rendering), SSR(Server Side Rendering), SSG(Static Site Generation), ISR(Incremental Static Regeneration)) (14) | 2024.11.14 |
| [Next.js] 테마 토글 기능 설정하기 (with shadcn/ui) (0) | 2024.11.05 |
| [Next.js] 갑자기 "'next'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는배치 파일이 아닙니다." 오류가 발생할 때 해결 방법 (0) | 2024.10.30 |
| [Next.js] 환경 변수 사용 방법 (1) | 2024.10.29 |