styled-components 설치 오류: react-dom dependency 해결방법

React 의 styled-components Library 를 설치하려니까 아래와 같은 오류가 났다.

npm error code ERESOLVE
npm error ERESOLVE unable to resolve dependency tree
npm error
npm error While resolving: my-first-expo@1.0.0
npm error Found: react@18.3.1
npm error node_modules/react
npm error react@"18.3.1" from the root project
npm error peer react@">= 16.8.0" from styled-components@6.1.15
npm error node_modules/styled-components
npm error styled-components@"" from the root project
npm error
npm error Could not resolve dependency:
npm error peer react@"^19.0.0" from react-dom@19.0.0
npm error node_modules/react-dom
npm error peer react-dom@">= 16.8.0" from styled-components@6.1.15
npm error node_modules/styled-components
npm error styled-components@"" from the root project
npm error
npm error Fix the upstream dependency conflict, or retry
npm error this command with --force or --legacy-peer-deps
npm error to accept an incorrect (and potentially broken) dependency resolution.
npm error
npm error
npm error For a full report see:
npm error /Users/naralee/.npm/_logs/2025-03-06T05_55_12_644Z-eresolve-report.txt
npm error A complete log of this run can be found in: /Users/naralee/.npm/_logs/2025-03-06T05_55_12_644Z-debug-0.log

에러코드 보면 내 현재 react native project 가 react@"18.3.1" 버젼은 있는데 react-dom은 안깔려 있다고 말하고 있다.

npm install react-dom@18.3.1

로 내 현재 프로젝트의 react version 과 맞는 react-dom을 manually 설치해주면

npm install styled-components
했을때 오류 없이 잘 설치된다.

출처: styled-components 설치 오류: Dependency 해결방법

현재 프로젝트에 설치된 react와 react-dom 버젼은 package.json 에서 확인할 수 있다.

// package.json
{
  "dependencies": {
    "styled-components": "^6.1",
    "react": "^18.0.0",
    "react-dom": "^18.0.0",
    "sanity": "^3.0.0"
  }
}

---

본 후기는 [한글과컴퓨터x한국생산성본부x스나이퍼팩토리] 한컴 AI 아카데미 (B-log) 리뷰로 작성 되었습니다.

#한컴AI아카데미 #AI개발자 #AI개발자교육 #한글과컴퓨터 #한국생산성본부 #스나이퍼팩토리 #부트캠프 #AI전문가양성 #개발자교육 #개발자취업