ELECTRON (18) 썸네일형 리스트형 [electron] Windows 에서 electron-builder를 사용할 때 프로그램 설치 폴더 변경하기. electron-builder로 프로그램 설치 파일 만들고 프로그램을 설치하면 아래와 같은 경로에 설치되는 것 같습니다. C:\Users\사용자이름\AppData\Local\Programs\프로그램이름 그런데 보통 C:\Program Files 또는 C:\Program Files (x86)를 사용하잖아요??? 그래서 설치 폴더를 변경하는 방법을 찾아보았습니다. NSIS 스크립트 https://www.electron.build/configuration/nsis.html#custom-nsis-script NSIS - electron-builder NSIS The top-level nsis key contains set of options instructing electron-builder on how it .. electron에서 WIN32 API SendMessage 사용하기. electron프로그램에서 다른 윈도우 프로그램으로 메시지를 전달해야할 일이 생겼습니다. 오잉??? 이게 되려나??? 물론 되기야 하겠죠? 제 내공이 얕아서 잘 모를뿐 ㅎㅎ 역시나 이런 저런 키워드로 검색해보니 딱 있습니다. Node.js Foreign Function Interface for N-API - node-ffi-napi Node라이브러리 말고, 윈도우 DLL 라이브러리등을 사용할 수 있게 해 줍니다. Linux, OS X, Windows, Solaris에서도 돌아간다는데 저는 Windows에서만 사용해 봤습니다 EnumWindows로 실행중인 프로그램을 하나 찾아 그 녀석에게 메시지 하나를 날려주는 간단한 작업입니다. * 윈도우 개발툴이 필요합니다. Visual Studio 없으시면, 개발툴.. 맥(MacOS)에서 globstar 패턴 인식 안 될때!!! ELECTRON으로 프로그램 만들고 동작 확인할 때 운영체제마다 약간의 차이로 코드가 안 돌아갈 때가 있습니다. 이번에 부딪힌 문제는 npm으로 파일 복사 스크립트를 실행할 때 globstar 패턴인식에 문제가 있었습니다. 예를 들어 아래와 같은 npm 스크립트가 있다면, copyFiles scr/assets/**/* 윈도 10에서는 scr/assets/ 하위에 있는 폴더와 파일을 다 불러올 수 있는데 맥에서는 안 되더군요. 한동안 테스트 끝에 스크립트의 문제가 아니라 각 종 설정의 문제란 걸 알게 되었습니다. 1. bash 버전 문제 현재 bash 버전이 너무 낮아 globstar 패턴을 제대로 인식하지 못했습니다. 터미널에서 아래 명령 실행에 실패하면 bash 업데이트를 해야 합니다. shopt -s.. electron-builder 결과물 사이즈가 너무 클 때!!! electron-builder로 win32를 빌드했는데 파일 사이즈가 무려 400MB !!!??? 아무래도 이상해서 원인을 찾아봤습니다. 먼저, build 옵션 중 asar을 false로 한 후 어떤 파일이 배포 파일에 들어있나 확인했습니다. { ...... "build": { ...... "asar":false, ...... }, ...... } 그랬더니, 프로그램 소스 파일 외 각종 자료가 들어 있는 폴더가 들어있었습니다. 그 외 vscode 관련 설정 파일도 있더군요. 불필요한 파일을 제외하는 방법을 찾아보니 electron-builder 옵션 중 files란게 있었습니다. https://www.electron.build/configuration/contents ELECTRON + TypeScript 사용해 보기(2) - cannot find module ... 2021.06.21 - [ELECTRON] - ELECTRON + TypeScript 사용해 보자(1) 이번에는 모듈 경로 설정에 대해서 살펴보겠습니다. 간단한 테스트를 위해 src/modules에 util.ts를 추가하고 함수를 하나 추가하고, export function testUtil():void { console.log("testUtil") } renderer.ts에 testUtil을 사용하는 코드를 추가했습니다. import { testUtil } from "./modules/util"; const newWindowBtn = document.getElementById('new-window'); newWindowBtn.addEventListener('click', (event) => { testU.. ELECTRON + TypeScript 사용해 보기(1) electron과 javascript로 데스크톱 앱을 개발하다 TypeScript를 적용해보기로 했다. TypeScript 개발 환경을 만들어 본 적이 없어서 겪은 시행착오를 남겨봅니다. 1. electron-quick-start-typescript TypeScript에 대해서 하나도 모르기 때문에 electron에서 제공하는 예제를 그대로 사용! https://github.com/electron/electron-quick-start-typescript electron/electron-quick-start-typescript Clone to try a simple Electron app (in TypeScript) - electron/electron-quick-start-typescript github... [electron] 파일 경로를 설정할 때 path 모듈을 사용하자. 파일 입, 출력 처리할 때 파일 경로를 입력해야 합니다. 이 경로를 설정할 때 문제가 되는 것은 운영체계마다 구분자가 다를 수 있다는 것입니다. 예로, 윈도는 C:\users\data.bin 이렇게 표현되고 맥 OS는 /users/data.bin으로 표현됩니다. 프로그램을 특정 OS 전용으로 만들 때는 문제가 안되지만, 멀티플랫폼을 지원할 경우 문제가 될 수 있습니다. 아래와 같이 하면 맥 OS에서는 문제가 될 수 있습니다. const makePath = (path, fileName) => { return `${path}\\${fileName}` } node에서 제공하는 path모듈을 사용하면 OS와 상관없이 잘 실행됩니다. const path = require("path"); const makePath.. [ELECTRON] vscode에서 디버깅 환경 설정 Electron 앱을 vscode를 사용해서 개발할 때 main process를 디버깅하려면 아래 절차를 따릅니다. 1. .vscode/launch.json 파일 추가. Electron 프로젝트 폴더에 .vscode 폴더를 만들고 그 안에 launch.json 파일을 추가합니다. 2. 디버깅 환경 설정. launch.json 파일에 아래 내용을 추가합니다. { "version": "0.2.0", "configurations": [ { "name": "Debug Main Process", "type": "node", "request": "launch", "cwd": "${workspaceFolder}", "runtimeExecutable": "${workspaceFolder}/node_modules/.bi.. 이전 1 2 3 다음