From 5c07643d24125e017b8ec96c54eb9ffe16527b6d Mon Sep 17 00:00:00 2001 From: arus Date: Fri, 23 Sep 2016 12:51:28 +0900 Subject: [PATCH] Apply debugging-main-process changes in korean --- .../debugging-main-process-node-inspector.md | 37 ++++++ .../tutorial/debugging-main-process-vscode.md | 128 +++++++++++++++++++++ .../ko-KR/tutorial/debugging-main-process.md | 75 ++---------- .../ko-KR/tutorial/planned-breaking-changes.md | 86 ++++++++++++++ 4 files changed, 262 insertions(+), 64 deletions(-) create mode 100644 docs-translations/ko-KR/tutorial/debugging-main-process-node-inspector.md create mode 100644 docs-translations/ko-KR/tutorial/debugging-main-process-vscode.md create mode 100644 docs-translations/ko-KR/tutorial/planned-breaking-changes.md diff --git a/docs-translations/ko-KR/tutorial/debugging-main-process-node-inspector.md b/docs-translations/ko-KR/tutorial/debugging-main-process-node-inspector.md new file mode 100644 index 0000000..5e7fc46 --- /dev/null +++ b/docs-translations/ko-KR/tutorial/debugging-main-process-node-inspector.md @@ -0,0 +1,37 @@ +# VSCode 에서 메인 프로세스 디버깅하기 + +### 1. VS Code 에서 Electron 프로젝트 열기. + +```bash +$ git clone git@github.com:electron/electron-quick-start.git +$ code electron-quick-start +``` + +### 2. 다음 설정으로 `.vscode/launch.json` 파일 추가하기: + +```json +{ + "version": "0.2.0", + "configurations": [ + { + "name": "Debug Main Process", + "type": "node", + "request": "launch", + "cwd": "${workspaceRoot}", + "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron", + "program": "${workspaceRoot}/main.js" + } + ] +} +``` + +**참고:** 윈도우에서, `runtimeExecutable` 을 위해 `"${workspaceRoot}/node_modules/.bin/electron.cmd"` 를 사용하세요. + +### 3. 디버깅 + +`main.js` 에 중단점을 설정하고, +[Debug View](https://code.visualstudio.com/docs/editor/debugging) 에서 디버깅을 +시작하세요. 중단점을 만나게 될 것 입니다. + +VSCode 에서 바로 디버깅 할 수 있는 프로젝트를 미리 준비했습니다: +https://github.com/octref/vscode-electron-debug/tree/master/electron-quick-start diff --git a/docs-translations/ko-KR/tutorial/debugging-main-process-vscode.md b/docs-translations/ko-KR/tutorial/debugging-main-process-vscode.md new file mode 100644 index 0000000..d599abf --- /dev/null +++ b/docs-translations/ko-KR/tutorial/debugging-main-process-vscode.md @@ -0,0 +1,128 @@ +# node-inspector 에서 메인 프로세스 디버깅하기 + +[`node-inspector``][node-inspector] 는 Electron 의 메인 프로세스를 디버깅하기 +위해 크롬에서 사용할 수 있는 익숙한 개발도구 GUI 를 제공합니다. 그러나, +`node-inspector` 가 네이티브 Node 모듈에 의존적이기 때문에 디버깅하려는 +Electron 버전에 맞춰 다시 빌드해야 합니다. `node-inspector` 다시 빌드하여 +종속성을 재구성하거나 [`electron-inspector`] 가 대신 하게 할 수 있으며, 두 +방식이 이 문서에 나와있습니다. + +**참고**: 글쓴 시점 현재 `node-inspector` 최종버전 (0.12.8) 은 Electron 1.3.0 +이상에서 해당 종속성 중 하나를 패치하지 않고 빌드 할 수 없습니다. +`electron-inspector` 을 사용한다면 알아서 처리될 것 입니다. + + +## 디버깅에 `electron-inspector` 사용하기 + +### 1. [node-gyp 필수 도구][node-gyp-required-tools] 설치 + +### 2. [`electron-rebuild`][electron-rebuild]가 없다면, 설치 + +```shell +npm install electron-rebuild --save-dev +``` + +### 3. [`electron-inspector`][electron-inspector] 설치 + +```shell +npm install electron-inspector --save-dev +``` + +### 4. Electron 시작 + +`--debug` 스위치와 함께 Electron 실행: + +```shell +electron --debug=5858 your/app +``` + +또는, 스크립트의 첫번째 줄에서 실행 중단: + +```shell +electron --debug-brk=5858 your/app +``` + +### 5. electron-inspector 시작 + +macOS / Linux: + +```shell +node_modules/.bin/electron-inspector +``` + +Windows: + +```shell +node_modules\\.bin\\electron-inspector +``` + +`electron-inspector` 는 첫 실행과 Electron 버전 변경시에 `node-inspector` +종속성을 다시 빌드 할 것 입니다. 다시 빌드하는 과정에 Node 헤더와 라이브러리를 +다운받기 위해 인터넷 연결이 필요하며, 이 작업은 몇 분 정도 시간이 소요됩니다. + +### 6. 디버거 UI 로드 + +Chrome 브라우저에서 http://127.0.0.1:8080/debug?ws=127.0.0.1:8080&port=5858 +주소에 접속합니다. `--debug-brk` 로 시작한 경우 UI 갱신을 위해 일시정지 버튼을 +클릭해야 할 수도 있습니다. + + +## 디버깅에 `node-inspector` 사용하기 + +### 1. [node-gyp 필수 도구][node-gyp-required-tools] 설치 + +### 2. [`node-inspector`][node-inspector] 설치 + +```bash +$ npm install node-inspector +``` + +### 3. [`node-pre-gyp`][node-pre-gyp] 설치 + +```bash +$ npm install node-pre-gyp +``` + +### 4. Electron 용 `node-inspector` `v8` 모듈 재 컴파일 + +**참고:** 사용하는 Electron의 버전에 맞춰 target 인수를 변경하세요. + +```bash +$ node_modules/.bin/node-pre-gyp --target=1.2.5 --runtime=electron --fallback-to-build --directory node_modules/v8-debug/ --dist-url=https://atom.io/download/atom-shell reinstall +$ node_modules/.bin/node-pre-gyp --target=1.2.5 --runtime=electron --fallback-to-build --directory node_modules/v8-profiler/ --dist-url=https://atom.io/download/atom-shell reinstall +``` + +또한 [네이티브 모듈 설치 방법][how-to-install-native-modules] 문서도 참고해보세요. + +### 5. Electron 디버그 모드 활성화 + +다음과 같이 debung 플래그로 Electron 을 실행할 수 있습니다: + +```bash +$ electron --debug=5858 your/app +``` + +또는 스크립트 첫번째 줄에서 일시 정지할 수 있습니다: + +```bash +$ electron --debug-brk=5858 your/app +``` + +### 6. Electron을 사용하는 [`node-inspector`][node-inspector] 서버 시작하기 + +```bash +$ ELECTRON_RUN_AS_NODE=true path/to/electron.exe node_modules/node-inspector/bin/inspector.js +``` + +### 7. 디버거 UI 로드 + +Chrome 브라우저에서 http://127.0.0.1:8080/debug?ws=127.0.0.1:8080&port=5858 +주소에 접속합니다. `--debug-brk` 로 시작한 경우 엔트리 라인을 보기 위해 +일시정지 버튼을 클릭해야 할 수도 있습니다. + +[electron-inspector]: https://github.com/enlight/electron-inspector +[electron-rebuild]: https://github.com/electron/electron-rebuild +[node-inspector]: https://github.com/node-inspector/node-inspector +[node-pre-gyp]: https://github.com/mapbox/node-pre-gyp +[node-gyp-required-tools]: https://github.com/nodejs/node-gyp#installation +[how-to-install-native-modules]: using-native-node-modules.md#how-to-install-native-modules diff --git a/docs-translations/ko-KR/tutorial/debugging-main-process.md b/docs-translations/ko-KR/tutorial/debugging-main-process.md index fc6fee6..61a15b1 100644 --- a/docs-translations/ko-KR/tutorial/debugging-main-process.md +++ b/docs-translations/ko-KR/tutorial/debugging-main-process.md @@ -1,12 +1,13 @@ -# 메인 프로세스 디버깅하기 +# 메인 프로세스 디버깅하기 -브라우저 창의 개발자 도구는 웹 페이지 같은 렌더러 프로세스의 스크립트만 디버깅이 -가능합니다. 대신 Electron은 메인 프로세스의 디버깅을 위해 `--debug` 과 `--debug-brk` -스위치들을 제공합니다. +Electron 브라우저 창의 개발자 도구는 웹 페이지 같은 창에서 실행된 스크립트만 +디버깅이 가능합니다. 메인 프로세스에서 실행된 자바스크립트를 디버깅 하기 위해 +외부 디버거가 필요하며, Electron 실행시 `--debug` 또는 `--debug-brk` 스위치가 +필요합니다. ## 커맨드 라인 스위치(command line switches) -다음 스위치들을 사용하여 Electron의 메인 프로세스를 디버깅 할 수 있습니다: +다음 커맨드 라인 스위치들을 사용하여 메인 프로세스를 디버깅 할 수 있습니다: ### `--debug=[port]` @@ -17,64 +18,10 @@ `--debug`와 비슷하지만 스크립트의 첫번째 라인에서 일시정지합니다. -## node-inspector로 디버깅 하기 +## 외부 디버거 -**참고:** Electron은 현재 node-inspector 유틸리티와 호환성 문제가 있습니다. 이러한 -이유로 node-inspector 콘솔 내에서 메인 프로세스의 `process` 객체를 탐색할 경우 크래시가 -발생할 수 있습니다. +V8 디버거 프로토콜을 지원하는 디버거가 필요합니다. 다음 가이드들이 도움이 +됩니다: -### 1. [node-gyp 필수 도구][node-gyp-required-tools] 설치 - -### 2. [node-inspector][node-inspector] 설치 - -```bash -$ npm install node-inspector -``` - -### 3. [node-pre-gyp][node-pre-gyp] 설치 - -```bash -$ npm install node-pre-gyp -``` - -### 4. Electron용 `node-inspector` `v8` 모듈을 재 컴파일 - -**참고:** target 인수를 사용하는 Electron의 버전에 맞춰 변경하세요. - -```bash -$ node_modules/.bin/node-pre-gyp --target=1.2.5 --runtime=electron --fallback-to-build --directory node_modules/v8-debug/ --dist-url=https://atom.io/download/atom-shell reinstall -$ node_modules/.bin/node-pre-gyp --target=1.2.5 --runtime=electron --fallback-to-build --directory node_modules/v8-profiler/ --dist-url=https://atom.io/download/atom-shell reinstall -``` - -또한 [네이티브 모듈을 사용하는 방법][how-to-install-native-modules] 문서도 참고해보세요. - -### 5. Electron 디버그 모드 활성화 - -다음과 같이 debung 플래그로 Electron을 실행할 수 있습니다: - -```bash -$ electron --debug=5858 your/app -``` - -또는 스크립트 첫번째 라인에서 일시 정지할 수 있습니다: - -```bash -$ electron --debug-brk=5858 your/app -``` - -### 6. Electron을 사용하는 [node-inspector][node-inspector] 시작하기 - -```bash -$ ELECTRON_RUN_AS_NODE=true path/to/electron.exe node_modules/node-inspector/bin/inspector.js -``` - -### 7. 디버거 UI 로드 - -Chrome 브라우저에서 http://127.0.0.1:8080/debug?ws=127.0.0.1:8080&port=5858 주소에 -접속합니다. (기본 포트 또는 지정한 포트로 접속) 엔트리의 라인이 `debug-brk`로 시작하는 -경우 일시정지 버튼을 클릭해야 할 수도 있습니다. - -[node-inspector]: https://github.com/node-inspector/node-inspector -[node-pre-gyp]: https://github.com/mapbox/node-pre-gyp -[node-gyp-required-tools]: https://github.com/nodejs/node-gyp#installation -[how-to-install-native-modules]: using-native-node-modules.md#네이티브-모듈을-설치하는-방법 +- [Debugging the Main Process in VSCode](debugging-main-process-vscode.md) +- [Debugging the Main Process in node-inspector](debugging-main-process-node-inspector.md) diff --git a/docs-translations/ko-KR/tutorial/planned-breaking-changes.md b/docs-translations/ko-KR/tutorial/planned-breaking-changes.md new file mode 100644 index 0000000..f3dc7a4 --- /dev/null +++ b/docs-translations/ko-KR/tutorial/planned-breaking-changes.md @@ -0,0 +1,86 @@ +# API 변경 계획 + +다음은 Electron 2.0 에서 제거될 API 목록입니다. + +정해진 적용 계획은 없지만 적어도 90일 전에 중단 경고를 할 것 입니다. + +## `BrowserWindow` + +```js +// Deprecated +let optionsA = {webPreferences: {blinkFeatures: ''}} +let windowA = new BrowserWindow(optionsA) +// Replace with +let optionsB = {webPreferences: {enableBlinkFeatures: ''}} +let windowB = new BrowserWindow(optionsB) +``` + +## `clipboard` + +```js +// Deprecated +clipboard.readRtf() +// Replace with +clipboard.readRTF() + +// Deprecated +clipboard.writeRtf() +// Replace with +clipboard.writeRTF() + +// Deprecated +clipboard.readHtml() +// Replace with +clipboard.readHTML() + +// Deprecated +clipboard.writeHtml() +// Replace with +clipboard.writeHTML() +``` + +## `nativeImage` + +```js +// Deprecated +nativeImage.toPng() +// Replace with +nativeImage.toPNG() + +// Deprecated +nativeImage.toJpeg() +// Replace with +nativeImage.toJPEG() +``` + +## `process` + +```js +// Deprecated +process.versions['atom-shell'] +// Replace with +process.versions.electron +``` + +## `Tray` + +```js +// Deprecated +tray.setHighlightMode(true) +// Replace with +tray.setHighlightMode('on') + +// Deprecated +tray.setHighlightMode(false) +// Replace with +tray.setHighlightMode('off') +``` + +## `webContents` + +```js +// Deprecated +webContents.openDevTools({detach: true}) +// Replace with +webContents.openDevTools({mode: 'detach'}) +``` -- 2.7.4