#multiple

질문 1
해시태그 없이 키워드만 일치하는 질문은 개수에 포함되지 않아요.

6달 전 · 노원재 님의 답변 업데이트

ReactNative ios build 에러 3일째 해결을 못했습니다.

시뮬레이션을 실행하려고 해도 스크립트 문제, iPhone 버전 범위 문제, 시뮬레이터 문제가 계속 발생합니다. 어떤 도움이라도 감사합니다. ReactNative를 처음 접했습니다. 저희 팀에서 저를 도울 수 있는 사람이 없습니다. #프로젝트 환경 mac M2 ruby -v ruby 2.6.10p210 (2022-04-12 revision 67958) [universal.arm64e-darwin23] node -v v20.10.0 pod --version 1.15.2 package.json { "name": "labts", "version": "0.0.1", "private": true, "scripts": { "android": "react-native run-android", "ios": "react-native run-ios", "lint": "eslint .", "start": "react-native start", "test": "jest" }, "dependencies": { "@react-native-community/async-storage": "^1.12.1", "@react-native-community/cli": "13.6.9", "@react-navigation/bottom-tabs": "^6.6.0", "@react-navigation/native": "^6.1.17", "@react-navigation/native-stack": "^6.10.0", "@tanstack/react-query": "^5.51.5", "@types/react-native-vector-icons": "^6.4.18", "axios": "^1.7.2", "date-fns": "^3.6.0", "immer": "^10.1.1", "react": "18.2.0", "react-native": "0.74.3", "react-native-calendars": "^1.1305.0", "react-native-date-picker": "^5.0.4", "react-native-dotenv": "^3.4.11", "react-native-get-random-values": "^1.11.0", "react-native-image-crop-picker": "^0.41.2", "react-native-image-zoom-viewer": "^3.0.1", "react-native-paper": "^5.12.3", "react-native-permissions": "^4.1.5", "react-native-safe-area-context": "^4.10.8", "react-native-screens": "^3.32.0", "react-native-splash-screen": "^3.3.0", "react-native-tab-view": "^3.5.2", "react-native-vector-icons": "^10.1.0", "react-native-vision-camera": "^4.5.1", "uuid": "^10.0.0", "yarn": "^1.22.22" }, "devDependencies": { "@babel/core": "^7.20.0", "@babel/preset-env": "^7.20.0", "@babel/runtime": "^7.20.0", "@react-native/babel-preset": "0.74.85", "@react-native/eslint-config": "0.74.85", "@react-native/metro-config": "0.74.85", "@react-native/typescript-config": "0.74.85", "@types/react": "^18.2.6", "@types/react-native-dotenv": "^0.2.2", "@types/react-test-renderer": "^18.0.0", "babel-jest": "^29.6.3", "babel-plugin-module-resolver": "^5.0.2", "eslint": "^8.19.0", "jest": "^29.6.3", "prettier": "2.8.8", "react-test-renderer": "18.2.0", "typescript": "5.0.4" }, "engines": { "node": ">=18" } } PodFile require Pod::Executable.execute_command('node', ['-p', 'require.resolve( "react-native/scripts/react_native_pods.rb", {paths: [process.argv[1]]}, )', __dir__]).strip platform :ios, '12.0' use_frameworks! #use_modular_headers! prepare_react_native_project! linkage = ENV['USE_FRAMEWORKS'] if linkage != nil Pod::UI.puts "Configuring Pod with #{linkage}ally linked Frameworks".green use_frameworks! :linkage => linkage.to_sym end target 'nexlabts' do config = use_native_modules! use_react_native!( :path => config[:reactNativePath], # An absolute path to your application root. :app_path => "#{Pod::Config.instance.installation_root}/.." ) target 'nexlabtsTests' do inherit! :complete # Pods for testing end post_install do |installer| # https://github.com/facebook/react-native/blob/main/packages/react-native/scripts/react_native_pods.rb#L197-L202 react_native_post_install( installer, config[:reactNativePath], :mac_catalyst_enabled => false, # :ccache_enabled => true ) end end 제가 아래 에러 3가지에 대해 제가 해본 방법들입니다. 1. node 재설치 node_module 폴더 삭제, package-rock.json 삭제 후 재설치 npm install --legacy-peer-deps yarn install 2. Xcode가 node 읽을 수 있도록 설정 sudo ln -s "$(which node)" /usr/local/bin/node 3. Podfile 내 platform 설정 수정 platform :ios, '12.0' or platform :ios, '14.0' 4. Pods 재설치 rm -rf ~/Library/Developer/Xcode/DerivedData or rm -rf ~/Library/Developer/Xcode/DerivedData/* rm -rf Pods rm Podfile.lock pod install --repo-update Xcode \> Product \> Clean Build Folder. cd ./ios pod cache clean -all pod install --repo-update cd ../ npx react-native run-ios --no-packager --simulator="iPhone 15" or npx react-native run-ios --simulator="iPhone 15" or yarn start > i(run ios) Err 1. cocoaPods 설치할 때 [!] CocoaPods could not find compatible versions for pod "React-RuntimeHermes": In Podfile: React-RuntimeHermes (from ../node_modules/react-native/ReactCommon/react/runtime) Specs satisfying the React-RuntimeHermes (from ../node_modules/react-native/ReactCommon/react/runtime) dependency were found, but they required a higher minimum deployment target. Err2. iOS 실행할때 run-ios --no-packager --simulator="iPhone 15" Build description signature: fc1341421f84b87c5245d346c2c17b66 Build description path: /Users/nowonjae/Library/Developer/Xcode/DerivedData/nexlabts-argvodqcybjfcybstpulfpghnzvm/Build/Intermediates.noindex/XCBuildData/fc1341421f84b87c5245d346c2c17b66.xcbuilddata /Users/nowonjae/Desktop/project/NeXLabRN/ios/nexlabts.xcodeproj:1:1: error: Unable to open base configuration reference file '/Users/nowonjae/Desktop/project/NeXLabRN/ios/Pods/Target Support Files/Pods-nexlabts/Pods-nexlabts.release.xcconfig'. (in target 'nexlabts' from project 'nexlabts') warning: Unable to read contents of XCFileList '/Target Support Files/Pods-nexlabts/Pods-nexlabts-resources-Release-output-files.xcfilelist' (in target 'nexlabts' from project 'nexlabts') warning: Unable to read contents of XCFileList '/Target Support Files/Pods-nexlabts/Pods-nexlabts-frameworks-Release-output-files.xcfilelist' (in target 'nexlabts' from project 'nexlabts') error: Unable to load contents of file list: '/Target Support Files/Pods-nexlabts/Pods-nexlabts-frameworks-Release-input-files.xcfilelist' (in target 'nexlabts' from project 'nexlabts') error: Unable to load contents of file list: '/Target Support Files/Pods-nexlabts/Pods-nexlabts-frameworks-Release-output-files.xcfilelist' (in target 'nexlabts' from project 'nexlabts') warning: Run script build phase 'Bundle React Native code and images' will be run during every build because it does not specify any outputs. To address this warning, either add output dependencies to the script phase, or configure it to run in every build by unchecking "Based on dependency analysis" in the script phase. (in target 'nexlabts' from project 'nexlabts') warning: Run script build phase '[CP] Embed Pods Frameworks' will be run during every build because it does not specify any outputs. To address this warning, either add output dependencies to the script phase, or configure it to run in every build by unchecking "Based on dependency analysis" in the script phase. (in target 'nexlabts' from project 'nexlabts') error: Unable to load contents of file list: '/Target Support Files/Pods-nexlabts/Pods-nexlabts-resources-Release-input-files.xcfilelist' (in target 'nexlabts' from project 'nexlabts') error: Unable to load contents of file list: '/Target Support Files/Pods-nexlabts/Pods-nexlabts-resources-Release-output-files.xcfilelist' (in target 'nexlabts' from project 'nexlabts') warning: Run script build phase '[CP] Copy Pods Resources' will be run during every build because it does not specify any outputs. To address this warning, either add output dependencies to the script phase, or configure it to run in every build by unchecking "Based on dependency analysis" in the script phase. (in target 'nexlabts' from project 'nexlabts') --- xcodebuild: WARNING: Using the first of multiple matching destinations: { platform:iOS Simulator, id:B5AA2E84-4F83-4749-A986-A1FCE5E398A3, OS:17.5, name:iPhone 15 } { platform:iOS Simulator, id:B5AA2E84-4F83-4749-A986-A1FCE5E398A3, OS:17.5, name:iPhone 15 } ** BUILD FAILED ** ] Err3. Xcode 로 Build 할때 (Any iOS Simulator Device (arm64, x86_64)) Command PhaseScriptExecution failed with a nonzero exit code

개발자

#reactnative

#xcode

#reactnative-run-ios

답변 1

댓글 0

조회 427

<input type="file" multiple> 관련하여..

<template> <div> <input ref="fileInput" type="file" accept="image/*" multiple="true" @change="handleFileInputChange" /> <button @click="openFileInput" class="select-button"> Select Images </button> <div class="preview-container"> <div v-for="file in selectedFiles" :key="file.lastModified" class="preview-item" > <p>{{ file.name }}</p> <div class="preview"> <img :src="previewImage" style="width: 100px" /> </div> <!-- <img :src="URL.createObjectURL(file)" /> --> <button @click="removeFile(file.lastModified)" class="remove-button"> X </button> </div> </div> </div> </template> <script setup lang=“ts”> const fileInput = ref() const selectedFiles: Ref<Array<any>> = ref([]) const openFileInput = () => { fileInput.value.click() } const previewImage = ref<any>('') const handleFileInputChange = e => { // const files = Array.from(fileInput.value.files) const files = e.target.files console.log('files', files) selectedFiles.value.push(...files) console.log('add selectedFiles', selectedFiles.value) for (let i = 0; i < selectedFiles.value.length; i++) { const file = selectedFiles.value[i] console.log('handleFileInputChange_ file', selectedFiles.value[i]) const reader = new FileReader() reader.onload = e => { previewImage.value = e.target.result } reader.readAsDataURL(file) } } const removeFile = lastModified => { selectedFiles.value = selectedFiles.value.filter( file => file.lastModified !== lastModified ) console.log('remove selectedFiles', selectedFiles.value) } </script> 모바일에서 카메라로 찍은 여러장의 사진들이 각각의 썸네일로 노출되어야함 현재는 최신 사진으로 엎어치기 됨.. 예) 'A B C D' 의 사진이 나와야하는데 현재는 A 찍고 B찍으면 'B B' 가 됨 C찍으면 'C C C'가 됨 도와주세요!

개발자

#input

#type='file'

#vue3

#multiple

#preview

답변 3

댓글 0

보충이 필요해요 1

조회 171

일 년 전 · 익명 님의 새로운 댓글

Nextjs App router 동작 방식이 이해가 안됩니다.

https://nextjs.org/docs/app/building-your-application/rendering/client-components // 문서내용 Defining multiple use client entry points: You can define multiple "use client" entry points in your React Component tree. This allows you to split your application into multiple client bundles (or branches). However, "use client" doesn't need to be defined in every component that needs to be rendered on the client. Once you define the boundary, all child components and modules imported into it are considered part of the client bundle. => 클라이언트 컴포넌트의 하위 컴포넌트들은 자동으로 전부 클라이언트 컴포넌트가 됨(use-client 명시할 필요X) 으로 이해했습니다. 그런데 첨부한 코드의 동작방식이 이해가 안됩니다. 예상 1. TestComponent가 클라이언트 컴포넌트(CSR)이므로 내부에 있는 HotEventList도 클라이언트 단에서동작할 것이다. 2. TestComponent를 ‘use client’로 클라이언트 컴포넌트로 만들었다. HotEventList에서는 useState등 CSR에 필요한 요소를 추가하더라도 ‘use client’를 추가할필요가 없다. TestComponent하위에 있어서 자동으로 클라이언트 컴포넌트가 되기 때문이다. 실제 1. HotEventList는 여전히 SSR로 동작한다. 2. HotEventList에 state를 추가하면 ‘use client’를 명시하라는 에러가 발생한다. 제가 어떤 부분을 잘못 이해하고 있는걸까요?

개발자

#next.js

#react

#ssr

#csr

#server-component

답변 1

댓글 1

조회 202

일 년 전 · 손정현 님의 새로운 댓글

MongoDB에서 Aggregation Operators는 통계용으로만 써야할까요?

공식 문서를 보면 통계용으로만 써야하는건가 싶어서요. Aggregation operations process multiple documents and return computed results. You can use aggregation operations to: - Group values from multiple documents together. - Perform operations on the grouped data to return a single result. - Analyze data changes over time.

개발자

#mongodb

#aggregation

#operators

답변 1

댓글 2

조회 96

7달 전 · 채수혁 님의 새로운 답변

프론트엔드 - Docker-Compose 문제

docker-compose를 세팅 중 빌드 오류가 있어 질문 드립니다. 문제의 원인이 prod 환경의 compose.yml라고 예상되어지는데 dev 환경의 compose에서는 env 파일을 정상 인식하지만 prod 환경의 compose에서는 env 파일을 인식하지 못하는 문제인데요. docker-compose 명령어를 실행할 때, .env 파일이 있는 경로에서 실행을 하고있고 docker-compose.prod.yml과 .env 파일에 정의된 변수 이름도 오탈자는 없습니다. 어떻게 해야 docker build시, prod에서는 args를 사용할 때 production.env(= multiple .env)파일을 인식하게 할 수 있을까요? 혹시 제가 놓치고 있는 부분이 있을까요? 추가로, 관련된 코드와 설정은 Stack Overflow에 업로드를 해뒀는데요, 답변 주시면 정말 감사하겠습니다! https://stackoverflow.com/questions/78857841/docker-compose-not-recognizing-environment-variables-in-next-js-application-pro

개발자

#docker

#docker-compose

#도커

#에러

#프론트엔드

답변 1

댓글 0

조회 65

2년 전 · 블레어리 님의 질문

MUI autocomplete

MUI autocomplete사용시 (multiple) 웹에서는 잘 작동하는데 모바일에서는 이전 값의 뒷글자가 따라나와서 두번째 입력한 값 앞부분에 붙어서 나옵니다. 어떤 옵션을 써도 해결이 안되서 질문드립니다

개발자

#react

#mui

답변 0

댓글 0

조회 48

2년 전 · 이승우 님의 새로운 댓글

안드로이드 권한 2번 이상 거부시 승인요청 팝업

안녕하세요 코틀린으로 앱개발 공부중인데 해결 안되는 게 있어서 문의드립니다. 저는 앱을 설치하고 처음 접속시 권한(Permission)부터 승인요청하도록 만들고 있어요. RequestMultiplePermissions 를 활용하여 여러 권한을 한번에 처리해보도록 코딩하고 있는데 아무리 코드를 작성해도 사용자가 연속 2번 거부 누를 경우 어플을 재접속해도 승인요청 팝업이 생성되지 않습니다. 어떻게 코드를 작성해야 거부를 계속 누르더라도 권한 필요성 설명 팝업을 통해 동의를 얻는 순간 무한정으로 승인요청 팝업을 생성할 수 있을까요?

개발자

#kotlin

#permission

#안드로이드-권한

#승인요청

답변 1

댓글 1

조회 465

일 년 전 · 익명 님의 새로운 댓글

Nextjs app router 사용시 multiple layout은 보통 어떻게 구성하시나요?

예를들어서 헤더와 사이드바가 있을 때 루트 레이아웃에 헤더와 사이드바를 구성해두면 다른 페이지에서 추가 작성하거나 관리할 필요가 없어서 편리할거 같긴합니다. 하지만 로그인 페이지나 회원가입 페이지에선 사이드바가 필요가 없는 상황일 경우 레이아웃 구성을 어떻게 하는게 좋을까요? 1. 루트 레이아웃엔 최소한의 구성만 하고 개별 페이지 레이아웃에 추가 구성을 한다. 2. 그외의 다른 방법 추천 부탁드립니다.

개발자

#react

#next.js

답변 2

댓글 2

조회 1,279