전체(132)
-
[Vue] TypeError: (0 , vue__WEBPACK_IMPORTED_MODULE_0__.effectScope) is not a function 에러 발생할 경우
뷰에서 코딩하다 보면 간혹 TypeError: (0 , vue__WEBPACK_IMPORTED_MODULE_0__.effectScope) is not a function 에러를 맞딱뜨리는 경우가 있다. System.err: An uncaught Exception occurred on "main" thread. System.err: Unable to create application com.tns.NativeScriptApplication: com.tns.NativeScriptException: Error calling module function System.err: TypeError: (0 , vue__WEBPACK_IMPORTED_MODULE_0__.effectScope) is not a functi..
2023.09.18 -
[Vue3] Composition API 사용 예시 (Vue2와 비교)
뷰3로 버전업이 되면서 변경된 점 중 하나만 Composition API 의 추가여부이다. 뷰2와 어떤 부분이 달라지는지 다음의 예시로 감을 잡아보자. 예시) 할 일 목록에 할 일을 추가하고, 완료 상태를 토글할 수 있는 기능 Vue3 컴포지션 API 사용하여 만든 예시(함수 내부에서 상태와 로직을 명확하게 구성하여 관리하여 재사용성 및 가독성이 좋음) // 화면 표시 부분 Add Pending Tasks {{ task.text }} Complete Completed Tasks {{ task.text }} Uncomplete // UI 커스텀 Vue2 로 만든 예시(data, computed, methods) Add Pending Tasks {{ task.text }} Complete Completed ..
2023.09.15 -
[NativeScript] Can't find stylesheet to import.(@nativescript/theme/scss/variable/blue) 오류 해결
오늘도 즐거운 하이브리드 앱 코딩을 하고 있었으나, 여지없이 발생하는 컴파일 오류들을 해결해보자. 오늘은 네이티브스크립트에서 기본으로 제공하는 테마를 SCSS로 추가하였으나, 해당 파일을 찾지 못해 발생하는 오류였다. 휴.. 틀림없이 모든 모듈을 설치하고 시작한 줄 알았으나, 계속진행되는 개발로 인해 모듈이 없는지도 모르고 개발을 하여 발생한 오류.. 저 오류를 해결하기 위해서는 네이티브스크립트에서 기본 제공하는 테마 모듈을 설치해야 한다. "npm install @nativescript/theme" 아래의 명령어로 모듈 설치 후 컴파일을 진행하면 바로 해결되는 것을 알 수 있다.
2023.09.13 -
[NativeScript] ns run android 명령어 실행이 되지 않는 경우(sdk 버전 미스)
NativeScript 로 하이브리드 앱을 코딩하고 빌드하고 실제 안드로이드 에뮬레이터에서 동작을 확인해보려고 하면, 실행이 잘 되지 않는 경우가 발생한다. 주로 개발컴에서 셋팅을 다 해두고 깃허브 같은 곳에 푸시한 다음, 집 컴퓨터에서 깃 클론으로 땡겨서 빌드하는 경우에 종종 발생할 수 있는데, 주로 원인은 SDK 버전과 Build Tool 버전이 안맞아서 발생한다. 그런 경우 아래와 같은 에러 로그를 볼 수 있다. 에러 문구를 잘 보면 컴파일에 호환되는 SDK 버전이 잘 맞지 않는다고 나오는 것을 알 수 있다. Execution failed for task ':app:checkDebugAarMetadata'. 4 issues were found when checking AAR metadata: 1. ..
2023.09.12 -
[네트워크] strict-origin-when-cross-origin 오류 해결
하이브리드 앱을 개발하다 보니 다양한 상황에서 예상치 못한 이슈가 발생한다. 특히 네트워크 부분은 지식이 많지 않다보니, 네트워크 관련 이슈 발생 시 항상 고전하고 있다. 오늘은 네트워크의 크로스필터(strict-origin-when-cross-origin) 이슈를 알아보자. 네트워크 조건 노트북 네트워크는 사내 내부망에 물려있다. 테스트 디바이스 네트워크는 노트북의 테더링으로 물려있다. 문제 현상 하이브리드 프론트를 노트북의 브라우져 에뮬레이터에서 API 호출 시 strict-origin-when-cross-origin 발생 하이브리드 앱을 모바일 디바이스에 설치 후 API 호출 시 정상 동작 결국 이 부분에 대한 해결책은 서버쪽에서 크로스 필터 예외 처리를 해주거나 실제 디바이스에서 테스트 하는 2가..
2023.09.12 -
[Vue] Webpack 기반 Vue 샘플 프로젝트 생성 및 실행해보기
사전 준비 1. 자바 SDK 설치(11 버전 추천) 2. 안드로이드 스튜디오 설치 3. 시스템 PATH 설정 4. 노드JS 설치 5. Native Script 설치 6. 프로젝트 생성 7. 샘플 프로젝트 실행 확인 8. 즐거운 코딩 차근차근 해보자. 1. 자바 SDK 설치 - Java Archive Downloads - Java SE 11 | Oracle 대한민국 에 방문해서 각 OS에 맞는 버전 설치, 오라클 계정이 없다면 생성하고 다운로드 한다. Java Archive Downloads - Java SE 11 | Oracle 대한민국 WARNING: These older versions of the JRE and JDK are provided to help developers debug issues ..
2023.09.11