Study & Project ✏️/Bug & Report 🐞 16

[electron-forge Error] You may need to re-bundle the app using Electron Packager's "executableName" option.

우선 제 작업 환경을 알려주고 시작하겠습니다. Desktop: Window10 Arch: AMD WSL: Linux Ubuntu (Arch: AMD) Target Compile: Linux (Arch: arm64) 간략하게 설명하자면 윈도우 환경에서 Linux(arm64)로 크로스컴파일을 진행하려고 하는 상황입니다. You may need to re-bundle the app using Electron Packager's "executableName" option. 라는 오류가 나왔다면 아마 크로스컴파일을 시도하는 상황일 경우일텐데 이제부터 자세히 알아보자 1. 문제 이유 electron-forge의 공식 페이지에서 설명하는 컴파일 방법은 총 두 가지다. https://www.electronforge.i..

[Error]fakeroot, while creating message channels: Function not implemented 해결 방법

electron에서 fakeroot를 이용한 컴파일링 도중에 해당 오류가 나왔다. fakeroot, while creating message channels: Function not implemented fakeroot: error while starting the `faked' daemon. 해당 오류본은 캡처가 안되어 있지만 이해점...ㅎㅎ 처음엔 해당 오류가 permission과 관련된 오류인 줄 알고 root계정, chown을 통해서 실행권한을 주려고 애썼는데 해결되지 않았다. 그러던 도중... Function not implemented를 보고 해당 문구를 구글링 해보다가 다음 해결책을 찾았다. 이 멋진 형님의 말씀대로라면 우리의 빌드가 될 파일 시스템에다가 fakeroot-tcp를 복사해 주라..

[node-gyp rebuild]Error: node-gyp failed to rebuild 에러 분석 및 해결 방법 (feat. electron-forge)

기존 프로젝트를 쳐내고 오랜만에 다시 electron을 건들던 중... 과거엔 electron-builder를 이용해서 패키징과 컴파일링을 진행했는데, 이번에 공식 홈페이지에 가보니 electron-forge가 메인 빌더라고 적혀있었다. https://www.electronjs.org/docs/latest/tutorial/tutorial-packaging Packaging Your Application | Electron To distribute your app with Electron, you need to package it and create installers. www.electronjs.org 그래서 electron-forge로 빌더 교체를 진행하고 여러 가지 컴파일링을 시도해 봤다. 그러나....

[Electron] Uncaught Exception: TypeError: Object has been destroyed at IpcMainImpl 에러 해결

😎 Introduction 아마도 이 글을 보는 당신은 어느 정도 수준급 이상의 앱을 만들고 있을 거라고 생각한다. 그리고 이 문제는 멀티윈도우에서 나타났을 거라고 생각한다. 나의 작은 고생이 누군가에게는 빠른 해결이 되길 바라며!!! 🐞 BUG 오류를 해석하자면 메인프로세스에서 오류가 났는데, Object가 파괴됐었기 때문에 메인 프로세스에서 실행할 수 없다고 하는 것이다. 🗝️ Solution 기존 방법 같은 경우 우측 상단의 해당 x버튼을 누르거나 별도로 선언한 ipcRenderer.send()를 통해 Main process로 이벤트를 전달하고, 메인 프로세스에서 해당 window.close()를 통해 종료시켰을 것이다. 하지만, 해당 방법을 사용해도 동일한 오류가 발생했다. 추가적으로 구글링 해 ..

[VScode]코드 정렬 단축키 바꾸기

vscode는 정말 강력하고 좋은 에디터다 기존에 Ctrl + K + F 같은 커맨드로 코드 정렬을 해왔을 텐데 이게 상당히 불편하다. 그래서 코드 정렬 단축키를 바꿔보겠다. 파일 -> 기본 설정 -> 바로 가기 키로 들어가게 되면 이런 식으로 단축키들이 엄청나게 등록되어 있는 걸 알 수 있다. 위에 format을 검색하고 문서 서식을 더블 클릭해주면! 원하는 키로 바꿀 수 있다!!! Ctrl + F11은 잘 안 쓰는 키 조합이니 이걸로 바꿔줬다. 하나 주의할 점은 이런 식으로 빨간 줄이 있을 때는 코드 정렬이 되지 않으니, 빨간 줄부터 해결해야 한다

vue3 [Vuetify 적용 오류] ValidationError: Progress Plugin Invalid Options 해결방법 [해결완료]

Vue3가 최근 버전인가...? 싶을 정도로 잔 버그가 많다. 예전 Flutter 2.0 나왔을 때 Firebase 관련 오류로 한참을 헤매었던 것처럼 ㅠㅠ 왜 항상 이런 시련은 나에게만....? vue -cli를 사용하고 있기에 아래 코드를 입력하면 된다. vue add vuetify vue3 를 사용하고 있으니 밑줄 쫙 버전을 설치하고! npm run serve 하면! ? 뭐야 왜 안돼 하지만 된다. 구글링 하자 https://stackoverflow.com/questions/69200086/okay-to-paste-in-package-lock-json-from-19-hours-ago-to-fix-validationerror-pr Okay to Paste-in Package-Lock.json from..

vue3 [WDS] Disconnected! 해결방법 [해결완료]

코딩애플님의 강의를 보고 따라 했다. https://www.youtube.com/watch?v=0BbF7UxKKvg&t=303s 다 좋은데!!!!! 왜 항상 이런 시련은 나에게만 오는 것일까? 해당 문제는 Vue의 장점이라고 하는 자동 렌더링이 안 되는 문제였다. 해당 문제를 확인하기 위해서 F12 크롬 DevTool을 열었다. 이것 외에 다양한 문구가 나왔는데 [WDS] Disconnected! ERROR_SSL_PROTOCOL_ERROR 이런 문구가 나왔다. WDS는 Webpack Development Server 라고 하는데 이 부분이 문제가 있는 것 같았다. 해당 문제를 해결하기 위해서 방화벽도 건드려보고 백신도 건드려봤는데 다 안되던 와중 https://tagmerge.com/question/v..