Toast UI 적용 중 의존성 문제(version 관련 문제)

[namuuCY]

문제 상황

Toast UI 설치 중 오류가 발생했습니다. 현재 세팅은 project의 initial setting과 동일합니다. (react @18.3.1, vite @5.4.3)

bash상에서 아래와 같이 입력했는데 사진의 오류가 뜹니다. $ npm install --save @toast-ui/react-editor

해당 라이브러리(@toast-ui/react-editor)의 package.json을 참조해보니

{
  "name": "@toast-ui/react-editor",
  "version": "3.2.3",
  "description": "TOAST UI Editor for React",
  "files": [
    "dist",
    "index.d.ts"
  ],
  "main": "dist/toastui-react-editor.js",
  "module": "dist/esm/index.js",
  "scripts": {
    "test:types": "tsc",
    "lint": "eslint .",
    "serve": "snowpack dev",
    "build": "webpack build && rollup -c"
  },
  "homepage": "https://ui.toast.com",
  "bugs": {
    "url": "https://github.com/nhn/tui.editor/issues"
  },
  "author": "NHN Cloud FE Development Lab <dl_javascript@nhn.com>",
  "repository": {
    "type": "git",
    "url": "https://github.com/nhn/tui.editor.git",
    "directory": "apps/react-editor"
  },
  "license": "MIT",
  "browserslist": "last 2 versions, ie 11",
  "peerDependencies": {
    "react": "^17.0.1"
  },
  "devDependencies": {
    "@types/react": "^17.0.3",
    "react": "^17.0.1",
    "react-dom": "^17.0.1"
  },
  "dependencies": {
    "@toast-ui/editor": "^3.2.2"
  }
}

그냥 dependency가 아닌 peerDependency로 되어있더라고요. 그래도 ^17.0.1 이라 될줄 알았는데 오류는 계속 뜹니다.

임시 해결 방안

일단 --force 이나 --legacy-peer-deps 와 같은 명령을 추가하면 강제로 설치되고 아래와 같이 기본적인 모양이 뜨기는 합니다.

다만 찾아보니 https://github.com/nhn/tui.editor/issues?q=is%3Aissue+is%3Aopen+react+18

react 18에서의 오류가 다소 있고, 22년부터 toast쪽의 추가적인 업데이트는 없는 것 같더라구요.

앞으로의 제안

방법은 크게 세 가지가 있어 보입니다.

1. react 버전을 17로 사용
2. 현재 처럼 강제로 설치된 상태에서 사용 (다만, 강제로 설치한 이후로 다른 툴을 설치할때도 같은 오류가 계속 뜨는것 같습니다. 물론 여전히 --force를 통해 강제로 설치는 가능합니다.)
3. react 18을 사용하는 다른 마크다운 에디터를 찾기

[namuuCY]

추가로 찾아보니 package.json의 semver에서 ^17.0.1 이라는 게 17.0.1 이상, 18 미만을 의미하는 것이었습니다. 17.0.1 이상인 17.x.x 버전에서의 변경 사항에 대해서만 호환성을 보장한다는 의미였네요. 이 에러가 왜 뜨는지는 이제 알겠습니다.

다만 여전히 선택의 문제는 남아있는 것 같습니다.

[namuuCY]

애런 : 실제 배포할 계획이라면,

1. 해당 라이브러리의 사용을 배제하는게 일반적
2. 어려운 방식으로는 해당 라이브러리를 커스텀화 후 만들어서 사용하는 방식도 존재

그렇지만 우리는 연습용 프로젝트

굳이 그렇게 할 필요 없다. --force와 같은 명령어로 강제로 인스톨 후 사용이 가능하다면 그렇게 하는 것도 괜찮다.

팀원과 합의 후 내용

현재 Toast UI 계속해서 사용하기로 결정.