Webview build시 오류 발생

개발
1

webview환경에서 bedrock build시 해당 오류가 발생합니다.

Removing the server build in /Users/jinsung/Documents/Development/***/***-ait/build/server due to ssr:false
✓ built in 65ms
│
◇  Building ios
│
◇  Building android
Internal Error: Build failed with 31 errors:
<stdin>:1:7: ERROR: [plugin: collect-package-version] Could not resolve "@ant-design/icons"
<stdin>:2:7: ERROR: [plugin: collect-package-version] Could not resolve "@apps-in-toss/web-framework"
<stdin>:3:7: ERROR: [plugin: collect-package-version] Could not resolve "@emotion/react"
<stdin>:4:7: ERROR: [plugin: collect-package-version] Could not resolve "@rajesh896/video-thumbnails-generator"
<stdin>:5:7: ERROR: [plugin: collect-package-version] Could not resolve "@react-router/node"
...
<stdin>:1:7: ERROR: [plugin: collect-package-version] Could not resolve "@ant-design/icons"
<stdin>:2:7: ERROR: [plugin: collect-package-version] Could not resolve "@apps-in-toss/web-framework"
<stdin>:3:7: ERROR: [plugin: collect-package-version] Could not resolve "@emotion/react"
<stdin>:4:7: ERROR: [plugin: collect-package-version] Could not resolve "@rajesh896/video-thumbnails-generator"
<stdin>:5:7: ERROR: [plugin: collect-package-version] Could not resolve "@react-router/node"
...
    at failureErrorWithLog (/Users/jinsung/Documents/Development/***/***-ait/node_modules/@apps-in-toss/plugins/node_modules/esbuild/lib/main.js:1463:15)
    at /Users/jinsung/Documents/Development/***/***-ait/node_modules/@apps-in-toss/plugins/node_modules/esbuild/lib/main.js:924:25
    at runOnEndCallbacks (/Users/jinsung/Documents/Development/***/***-ait/node_modules/@apps-in-toss/plugins/node_modules/esbuild/lib/main.js:1303:45)
    at buildResponseToResult (/Users/jinsung/Documents/Development/***/***-ait/node_modules/@apps-in-toss/plugins/node_modules/esbuild/lib/main.js:922:7)
    at /Users/jinsung/Documents/Development/***/***-ait/node_modules/@apps-in-toss/plugins/node_modules/esbuild/lib/main.js:949:16
    at responseCallbacks.<computed> (/Users/jinsung/Documents/Development/***/***-ait/node_modules/@apps-in-toss/plugins/node_modules/esbuild/lib/main.js:601:9)
    at handleIncomingPacket (/Users/jinsung/Documents/Development/***/***-ait/node_modules/@apps-in-toss/plugins/node_modules/esbuild/lib/main.js:656:12)
    at Socket.readFromStdout (/Users/jinsung/Documents/Development/***/***-ait/node_modules/@apps-in-toss/plugins/node_modules/esbuild/lib/main.js:579:7)
    at Socket.emit (node:events:518:28)
    at addChunk (node:internal/streams/readable:561:12)
    at readableAddChunkPushByteMode (node:internal/streams/readable:512:3)
    at Readable.push (node:internal/streams/readable:392:5)
    at Pipe.onStreamRead (node:internal/stream_base_commons:189:23)

package.json입니다.

{
  "name": "***-ait",
  "private": true,
  "type": "module",
  "scripts": {
    "build": "bedrock build",
    "dev": "bedrock dev",
    "start": "react-router-serve ./build/server/index.js",
    "typecheck": "react-router typegen && tsc",
    "deploy": "ait deploy"
  },
  "dependencies": {
    "@ant-design/icons": "^5.6.1",
    "@apps-in-toss/web-framework": "^0.0.40",
    "@emotion/react": "^11.14.0",
    "@rajesh896/video-thumbnails-generator": "^2.3.9",
    "@react-router/node": "^7.7.1",
    "@react-router/serve": "^7.7.1",
    "@tanstack/react-query": "^5.85.6",
    "@toss-design-system/colors": "^0.1.0",
    "@toss-design-system/mobile": "^2.0.1",
    "@toss-design-system/mobile-ait": "^2.0.1",
    "antd": "^5.27.2",
    "axios": "^1.11.0",
    "dayjs": "^1.11.18",
    "form-data": "^4.0.4",
    "isbot": "^5",
    "react": "^18.3.1",
    "react-dom": "^18.3.1",
    "react-naver-maps": "^0.1.4",
    "react-router": "^7.7.1",
    "react-timer-hook": "^4.0.5",
    "***-client-sdk": "gitlab:moable/***-client-sdk",
    "tailwind-merge": "^3.3.1"
  },
  "devDependencies": {
    "@react-router/dev": "^7.7.1",
    "@tailwindcss/vite": "^4.1.4",
    "@types/node": "^20",
    "@types/react": "^18.3.24",
    "@types/react-dom": "^18.3.7",
    "tailwindcss": "^4.1.4",
    "typescript": "^5.8.3",
    "vite": "^6.3.3",
    "vite-tsconfig-paths": "^5.1.4"
  }
}
2

안녕하세요 :slight_smile:
혹시 어떤 렌더링 방식을 사용하시나요 ? 현재 앱인토스는 CSR 방식만 지원하고 있습니다

3

안녕하세요

react router v7 사용해서 csr로 빌드하도록 했습니다.

웹쪽만 따로 빌드해서 보면 결과물은 이상없이 실행됩니다.

4

저희도

<stdin>:16:7: ERROR: [plugin: collect-package-version] Could not resolve "@tiptap/pm"
<stdin>:16:7: ERROR: [plugin: collect-package-version] Could not resolve "@tiptap/pm"

오류가 있습니다. csr을 사용중이고 미니앱에 실행시에 잘 실행됨을 확인했습니다
아래는 관련 library의 버전입니다


    "@tiptap/extension-color": "^2.11.5",
    "@tiptap/extension-highlight": "^2.11.5",
    "@tiptap/extension-link": "^2.11.5",
    "@tiptap/extension-placeholder": "^2.11.5",
    "@tiptap/extension-underline": "^2.11.5",
    "@tiptap/pm": "^2.11.5",
    "@tiptap/react": "^2.11.5",
    "@tiptap/starter-kit": "^2.11.5",
5

안녕하세요 :slight_smile:
React-router v7 framework mode 로 생성한 프로젝트에서는 ssr 설정을 다 제외해도 문제가 생기는 것 같은데..
data mode 로 프로젝트 새로 세팅해서 진행 해봐주실 수 있을까요?

6

안녕하세요

data mode와 React router 제거후 진행해도 같은 오류가 발생합니다.

혹시나 해서 CRA로 생성한 다른 프로젝트에도 해봤는데 다 android 빌드에서 오류가 나네요

세팅의 문제일까요? 샌드박스 앱으로는 iOS 시뮬레이터와 안드로이드 에뮬레이터(34API)에서 실행되는건 확인했고

개발환경은 Mac M3, Node v22.15.1 사용중입니다.

7

새로 생성한 프로젝트에서도 오류가 난다는 말씀이실까요 ?!
제가 테스트 했을때는 오류가 발생하지 않아서요 :cry:
오류 재현 과정을 알려주실 수 있을까요 ?

8

전달주신 pm 패키지의 구조와 앱인토스 ait 빌드 의존성 수집 구조의 충돌이 있습니다.

패키지 루트에 exports 맵이 있어야하는데, 모두 subpath네요.

require.resolve(‘@tiptap/pm’); 에서 에러가 나는거라,

다른 패키지를 이용해주시거나, 임시로 @tiptap/pm 쪽 package.json 을 강제 패치해서 사용해주실 수 있을까요 ?

[pm 쪽 package.json 을 patch]

"exports": {
  "./package.json": "./package.json"
}
9

새 vite 프로젝트에 개발자 문서대로 세팅하고 바로 빌드를 진행해도 동일한 오류가 발생했었습니다.

혹시나 해서 CRA로도 새로 만들어서 해봤는데 동일하게 나오네요

이번 새 sdk버전도 동일합니다.

10

안녕하세요 :slight_smile:
npm create vite@latest {앱명} -- --template react-ts
로 생성해서 web-framework 와 TDS만 설치하셔서 테스트 가능하실까요 ?

11

안녕하세요. 말씀드린대로 테스트했었던거였고 지금도 다시 해봤는데 동일합니다.

대신 윈도우vm에서 빌드를 진행했을땐 잘 되어서 일단 그렇게 진행해야할 것 같습니다.

1개의 좋아요
12

이상하네요 :cry:
넵, 다른 이슈 있으면 또 글 남겨주세요 !
감사합니다 :man_bowing: