Merge pull request #2658 from preco21/master
Improve grammar (KR), update as upstream
This commit is contained in:
Cheng Zhao
commit
50c7985ee2
20 changed files with 273 additions and 208 deletions
|
|
@ -36,7 +36,7 @@ npm install electron-prebuilt --save-dev
|
|||
[Docs](https://github.com/atom/electron/tree/master/docs/README.md)에 개발 가이드와 API 레퍼런스가 있습니다.
|
||||
Electron을 빌드 하는 방법과 프로젝트에 기여하는 방법도 문서에 포함되어 있으니 참고하시기 바랍니다.
|
||||
|
||||
## 참조 문서(번역)
|
||||
## 참조 문서 (번역)
|
||||
|
||||
- [한국어](https://github.com/atom/electron/tree/master/docs-translations/ko)
|
||||
- [일본어](https://github.com/atom/electron/tree/master/docs-translations/jp)
|
||||
|
|
|
|||
|
|
@ -20,11 +20,11 @@
|
|||
* [프로세스 객체](api/process.md)
|
||||
* [크롬 Command-Line 스위치 지원](api/chrome-command-line-switches.md)
|
||||
|
||||
커스텀 DOM Element:
|
||||
커스텀 DOM elements:
|
||||
|
||||
* [`File` 객체](api/file-object.md)
|
||||
* [`<webview>` 태그](api/web-view-tag.md)
|
||||
* [`window.open` 함수](api/window-open.md)
|
||||
* [`window.open` 메서드](api/window-open.md)
|
||||
|
||||
메인 프로세스를 위한 모듈들:
|
||||
|
||||
|
|
@ -40,6 +40,8 @@
|
|||
* [power-monitor](api/power-monitor.md)
|
||||
* [power-save-blocker](api/power-save-blocker.md)
|
||||
* [protocol](api/protocol.md)
|
||||
* [session](api/session.md)
|
||||
* [webContents](api/web-contents.md)
|
||||
* [tray](api/tray.md)
|
||||
|
||||
랜더러 프로세스를 위한 모듈들 (웹 페이지):
|
||||
|
|
@ -60,7 +62,7 @@
|
|||
|
||||
* [코딩 스타일](development/coding-style.md)
|
||||
* [소스 코드 디렉터리 구조](development/source-code-directory-structure.md)
|
||||
* [NW.js와 기술적으로 다른점 (이전 node-webkit)](development/atom-shell-vs-node-webkit.md)
|
||||
* [NW.js(node-webkit)와 기술적으로 다른점](development/atom-shell-vs-node-webkit.md)
|
||||
* [빌드 시스템 개요](development/build-system-overview.md)
|
||||
* [빌드 설명서 (Mac)](development/build-instructions-mac.md)
|
||||
* [빌드 설명서 (Windows)](development/build-instructions-windows.md)
|
||||
|
|
|
|||
|
|
@ -76,6 +76,12 @@ Squirrel은 "url"로 `Accept: application/zip` 헤더와 함께 업데이트 zip
|
|||
|
||||
`pub_date`은 ISO 8601 표준에 따라 포맷된 날짜입니다.
|
||||
|
||||
## 업데이트 서버 구현
|
||||
|
||||
[Nuts](https://github.com/GitbookIO/nuts)는 위에서 설명한 업데이트 서버의 오픈 소스 구현입니다.
|
||||
이 구현은 Github 릴리즈와 완벽하게 통합되어 있습니다. Nuts는 `Squirrel.Mac`과 `Squirrel.Windows`를 지원하고 다운로드와 업데이트를 관리합니다.
|
||||
이 구현을 사용하면 cross-platform 지원을 신경 쓸 필요가 없습니다.
|
||||
|
||||
## Events
|
||||
|
||||
`autoUpdater` 객체는 다음과 같은 이벤트를 발생시킵니다:
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# clipboard
|
||||
|
||||
`clipboard`는 복사/붙여넣기 작업을 수행하는 방법을 제공합니다. 다음 예제는 클립보드에 문자열을 씁니다:
|
||||
`clipboard` 모듈은 복사/붙여넣기 작업을 수행하는 방법을 제공합니다. 다음 예제는 클립보드에 문자열을 씁니다:
|
||||
|
||||
```javascript
|
||||
var clipboard = require('clipboard');
|
||||
|
|
@ -15,59 +15,65 @@ clipboard.writeText('Example String', 'selection');
|
|||
console.log(clipboard.readText('selection'));
|
||||
```
|
||||
|
||||
## clipboard.readText([type])
|
||||
## Methods
|
||||
|
||||
* `type` String
|
||||
`clipboard` 모듈은 다음과 같은 메서드를 가지고 있습니다:
|
||||
|
||||
**알림:** Experimental 마크가 붙은 API는 실험적인 기능이며 차후 최신 버전에서 제거될 수 있습니다.
|
||||
|
||||
### `clipboard.readText([type])`
|
||||
|
||||
* `type` String (optional)
|
||||
|
||||
클립보드 컨텐츠를 `plain text`로 반환합니다.
|
||||
|
||||
## clipboard.writeText(text[, type])
|
||||
### `clipboard.writeText(text[, type])`
|
||||
|
||||
* `text` String
|
||||
* `type` String
|
||||
* `type` String (optional)
|
||||
|
||||
클립보드에 `plain text`로 문자열을 씁니다.
|
||||
|
||||
## clipboard.readHtml([type])
|
||||
### `clipboard.readHtml([type])`
|
||||
|
||||
* `type` String
|
||||
* `type` String (optional)
|
||||
|
||||
클립보드 컨텐츠를 `markup`으로 반환합니다.
|
||||
|
||||
## clipboard.writeHtml(markup[, type])
|
||||
### `clipboard.writeHtml(markup[, type])`
|
||||
|
||||
* `markup` String
|
||||
* `type` String
|
||||
* `type` String (optional)
|
||||
|
||||
클립보드에 `markup`으로 씁니다.
|
||||
|
||||
## clipboard.readImage([type])
|
||||
### `clipboard.readImage([type])`
|
||||
|
||||
* `type` String
|
||||
* `type` String (optional)
|
||||
|
||||
클립보드로부터 [NativeImage](native-image.md)로 이미지를 읽어들입니다.
|
||||
|
||||
## clipboard.writeImage(image[, type])
|
||||
### `clipboard.writeImage(image[, type])`
|
||||
|
||||
* `image` [NativeImage](native-image.md)
|
||||
* `type` String
|
||||
* `type` String (optional)
|
||||
|
||||
클립보드에 `image`를 씁니다.
|
||||
|
||||
## clipboard.clear([type])
|
||||
### `clipboard.clear([type])`
|
||||
|
||||
* `type` String
|
||||
* `type` String (optional)
|
||||
|
||||
클립보드에 저장된 모든 컨텐츠를 삭제합니다.
|
||||
|
||||
## clipboard.availableFormats([type])
|
||||
### clipboard.availableFormats([type])
|
||||
|
||||
클립보드의 `type`에 해당하는 지원하는 `format`을 문자열로 반환합니다.
|
||||
|
||||
## clipboard.has(data[, type])
|
||||
### `clipboard.has(data[, type])`
|
||||
|
||||
* `data` String
|
||||
* `type` String
|
||||
* `type` String (optional)
|
||||
|
||||
클립보드가 지정한 `data`의 형식을 지원하는지 확인합니다.
|
||||
|
||||
|
|
@ -76,24 +82,20 @@ var clipboard = require('clipboard');
|
|||
console.log(clipboard.has('<p>selection</p>'));
|
||||
```
|
||||
|
||||
**알림:** 이 API는 실험적인 기능이며 차후 최신버전에서 제외될 수 있습니다.
|
||||
|
||||
## clipboard.read(data[, type])
|
||||
### `clipboard.read(data[, type])` _Experimental_
|
||||
|
||||
* `data` String
|
||||
* `type` String
|
||||
* `type` String (optional)
|
||||
|
||||
클립보드로부터 `data`를 읽어들입니다.
|
||||
|
||||
**알림:** 이 API는 실험적인 기능이며 차후 최신버전에서 제외될 수 있습니다.
|
||||
|
||||
## clipboard.write(data[, type])
|
||||
### `clipboard.write(data[, type])` _Experimental_
|
||||
|
||||
* `data` Object
|
||||
* `text` String
|
||||
* `html` String
|
||||
* `image` [NativeImage](native-image.md)
|
||||
* `type` String
|
||||
* `type` String (optional)
|
||||
|
||||
```javascript
|
||||
var clipboard = require('clipboard');
|
||||
|
|
|
|||
|
|
@ -1,30 +1,35 @@
|
|||
# content-tracing
|
||||
# contentTracing
|
||||
|
||||
`content-trace` 모듈은 Chromium 컨텐츠 모듈단에서 생성된 데이터를 수집하고 추적하는데 사용됩니다.
|
||||
`content-tracing` 모듈은 Chromium 컨텐츠 모듈단에서 생성된 데이터를 수집하고 추적하는데 사용됩니다.
|
||||
이 모듈은 웹 인터페이스를 포함하고 있지 않으며 크롬 브라우저에서 `chrome://tracing/` 페이지를 열어 생성된 파일을 로드하면 결과를 볼 수 있습니다.
|
||||
|
||||
```javascript
|
||||
var tracing = require('content-tracing');
|
||||
tracing.startRecording('*', tracing.DEFAULT_OPTIONS, function() {
|
||||
var contentTracing = require('content-tracing');
|
||||
|
||||
contentTracing.startRecording('*', contentTracing.DEFAULT_OPTIONS, function() {
|
||||
console.log('Tracing started');
|
||||
|
||||
setTimeout(function() {
|
||||
tracing.stopRecording('', function(path) {
|
||||
contentTracing.stopRecording('', function(path) {
|
||||
console.log('Tracing data recorded to ' + path);
|
||||
});
|
||||
}, 5000);
|
||||
});
|
||||
```
|
||||
``
|
||||
|
||||
## tracing.getCategories(callback)
|
||||
## Methods
|
||||
|
||||
`content-tracing` 모듈은 다음과 같은 메서드를 가지고 있습니다:
|
||||
|
||||
### `contentTracing.getCategories(callback)`
|
||||
|
||||
* `callback` Function
|
||||
|
||||
카테고리 그룹 세트를 가져옵니다. 카테고리 그룹은 도달된 코드 경로를 변경할 수 있습니다.
|
||||
|
||||
모든 child 프로세스가 `getCategories` 요청을 받으면 `callback`이 호출되며 인자에 카테고리 그룹의 배열이 전달됩니다.
|
||||
모든 child 프로세스가 `getCategories` 요청을 승인하면 `callback`이 한 번 호출되며 인자에 카테고리 그룹의 배열이 전달됩니다.
|
||||
|
||||
## tracing.startRecording(categoryFilter, traceOptions, callback)
|
||||
### `contentTracing.startRecording(categoryFilter, traceOptions, callback)`
|
||||
|
||||
* `categoryFilter` String
|
||||
* `traceOptions` String
|
||||
|
|
@ -33,7 +38,7 @@ tracing.startRecording('*', tracing.DEFAULT_OPTIONS, function() {
|
|||
모든 프로세스에서 레코딩을 시작합니다.
|
||||
|
||||
레코딩은 지역적으로 즉시 실행됩니다. 그리고 비동기로 child 프로세스는 곧 EnableRecording 요청을 받게 됩니다.
|
||||
모든 child 프로세스가 `startRecording` 요청을 받으면 `callback`이 호출됩니다.
|
||||
모든 child 프로세스가 `startRecording` 요청을 승인하면 `callback`이 한 번 호출됩니다.
|
||||
|
||||
`categoryFilter`는 어떤 카테고리 그룹이 트레이싱 되어야 하는지 필터링할 수 있습니다.
|
||||
필터는 `-` 접두사를 통해 특정 카테고리 그룹을 제외할 수 있습니다.
|
||||
|
|
@ -63,7 +68,7 @@ tracing.startRecording('*', tracing.DEFAULT_OPTIONS, function() {
|
|||
|
||||
`record-until-full`이 기본 모드, `enable-sampling`과 `enable-systrace`옵션은 포함되지 않음
|
||||
|
||||
## tracing.stopRecording(resultFilePath, callback)
|
||||
## `contentTracing.stopRecording(resultFilePath, callback)`
|
||||
|
||||
* `resultFilePath` String
|
||||
* `callback` Function
|
||||
|
|
@ -75,12 +80,12 @@ Child 프로세스는 일반적으로 추적 데이터와 희귀한 플러시
|
|||
우리는 추적에 의한 런타임 오버헤드를 피하고자 합니다.
|
||||
그래서 추적이 끝나면 모든 child 프로세스에 보류된 추적 데이터를 플러시 할 것인지 물어봅니다.
|
||||
|
||||
모든 child 프로세스가 `stopRecording` 요청을 받으면 `callback`에 추적 데이터를 포함한 파일을 전달됩니다.
|
||||
모든 child 프로세스가 `stopRecording` 요청을 승인하면 `callback`에 추적 데이터 파일을 포함하여 한 번 호출됩니다.
|
||||
|
||||
추적 데이터는 `resultFilePath` 해당 경로가 비어있는 경우에 한 해 해당 경로에 작성되거나 임시 파일에 작성됩니다.
|
||||
실제 파일 경로는 null이 아닌 이상 `callback`을 통해 전달됩니다.
|
||||
|
||||
## tracing.startMonitoring(categoryFilter, traceOptions, callback)
|
||||
### `contentTracing.startMonitoring(categoryFilter, traceOptions, callback)`
|
||||
|
||||
* `categoryFilter` String
|
||||
* `traceOptions` String
|
||||
|
|
@ -90,17 +95,17 @@ Child 프로세스는 일반적으로 추적 데이터와 희귀한 플러시
|
|||
|
||||
모니터링은 지역적으로 즉시 시작됩니다. 그리고 이내 자식 프로세스들이 `startMonitoring` 비동기 요청을 받습니다.
|
||||
|
||||
모든 자식 프로세스가 `startMonitoring` 요청을 받으면 `callback`이 호출됩니다.
|
||||
모든 자식 프로세스가 `startMonitoring` 요청을 승인하면 `callback`이 한 번 호출됩니다.
|
||||
|
||||
## tracing.stopMonitoring(callback);
|
||||
### `contentTracing.stopMonitoring(callback)`
|
||||
|
||||
* `callback` Function
|
||||
|
||||
모든 프로세스에서 모니터링을 중단합니다.
|
||||
|
||||
모든 자식 프로세스가 `stopMonitoring` 요청을 받으면 `callback`이 호출됩니다.
|
||||
모든 자식 프로세스가 `stopMonitoring` 요청을 승인하면 `callback`이 한 번 호출됩니다.
|
||||
|
||||
## tracing.captureMonitoringSnapshot(resultFilePath, callback)
|
||||
### `contentTracing.captureMonitoringSnapshot(resultFilePath, callback)`
|
||||
|
||||
* `resultFilePath` String
|
||||
* `callback` Function
|
||||
|
|
@ -112,15 +117,15 @@ Child 프로세스는 일반적으로 추적 데이터와 희귀한 플러시
|
|||
그리고 우리는 추적시 발생하는 불필요한 런타임 오버헤드를 피하고자 합니다.
|
||||
그래서 추적이 끝나면 반드시 비동기로 자식 프로세스들의 보류된 추적 데이터를 플러시 할 것인지 물어봅니다.
|
||||
|
||||
모든 자식 프로세스가 `captureMonitoringSnapshot` 요청을 받으면 추적 데이터 파일을 포함하는 `callback`이 호출됩니다.
|
||||
모든 자식 프로세스가 `captureMonitoringSnapshot` 요청을 승인하면 추적 데이터 파일을 포함하는 `callback`이 한 번 호출됩니다.
|
||||
|
||||
## tracing.getTraceBufferUsage(callback)
|
||||
### `contentTracing.getTraceBufferUsage(callback)`
|
||||
|
||||
* `callback` Function
|
||||
|
||||
추적 버퍼 % 전체 상태의 프로세스간 최대치를 가져옵니다. TraceBufferUsage 값이 결정되면 `callback`이 호출됩니다.
|
||||
추적 버퍼 % 전체 상태의 프로세스간 최대치를 가져옵니다. TraceBufferUsage 값이 결정되면 `callback`이 한 번 호출됩니다.
|
||||
|
||||
## tracing.setWatchEvent(categoryName, eventName, callback)
|
||||
### `contentTracing.setWatchEvent(categoryName, eventName, callback)`
|
||||
|
||||
* `categoryName` String
|
||||
* `eventName` String
|
||||
|
|
@ -128,6 +133,6 @@ Child 프로세스는 일반적으로 추적 데이터와 희귀한 플러시
|
|||
|
||||
`callback`은 지정된 이벤트가 어떤 작업을 발생시킬 때마다 호출됩니다.
|
||||
|
||||
## tracing.cancelWatchEvent()
|
||||
### `contentTracing.cancelWatchEvent()`
|
||||
|
||||
Watch 이벤트를 중단합니다. 만약 추적이 활성화되어 있다면 이 함수는 watch 이벤트 콜백과 race가 일어날 것입니다.
|
||||
Watch 이벤트를 중단합니다. 만약 추적이 활성화되어 있다면 이 메서드는 watch 이벤트 콜백과 race가 일어날 것입니다.
|
||||
|
|
|
|||
|
|
@ -1,9 +1,12 @@
|
|||
# crash-reporter
|
||||
# crashReporter
|
||||
|
||||
다음 예제는 윈격 서버에 어플리케이션 오류 정보를 자동으로 보고하는 예제입니다:
|
||||
`crash-reporter` 모듈은 어플리케이션의 크래시 정보를 자동으로 원격 서버에 업로드하는데 사용합니다.
|
||||
|
||||
다음 예제는 윈격 서버에 어플리케이션 크래시 정보를 자동으로 보고하는 예제입니다:
|
||||
|
||||
```javascript
|
||||
crashReporter = require('crash-reporter');
|
||||
var crashReporter = require('crash-reporter');
|
||||
|
||||
crashReporter.start({
|
||||
productName: 'YourName',
|
||||
companyName: 'YourCompany',
|
||||
|
|
@ -12,38 +15,42 @@ crashReporter.start({
|
|||
});
|
||||
```
|
||||
|
||||
## crashReporter.start(options)
|
||||
## Methods
|
||||
|
||||
* `options` Object
|
||||
* `productName` String, 기본값: Electron
|
||||
* `companyName` String, 기본값: GitHub, Inc
|
||||
* `submitUrl` String, 기본값: http://54.249.141.255:1127/post
|
||||
* Crash Reporter는 POST 방식으로 해당 URL에 전송됩니다.
|
||||
* `autoSubmit` Boolean, 기본값: true
|
||||
* true로 지정할 경우 유저의 승인 없이 자동으로 오류를 보고합니다.
|
||||
* `ignoreSystemCrashHandler` Boolean, 기본값: false
|
||||
* `extra` Object
|
||||
* 오류보고 시 같이 보낼 추가 정보를 지정하는 객체입니다.
|
||||
* 문자열로 된 속성만 정상적으로 보내집니다.
|
||||
* 중첩 객체는 지원되지 않습니다. (Nested objects are not supported)
|
||||
`crash-reporter` 모듈은 다음과 같은 메서드를 가지고 있습니다:
|
||||
|
||||
### `crashReporter.start(options)`
|
||||
|
||||
* `options` Object, properties:
|
||||
|
||||
* `productName` String, 기본값: Electron
|
||||
* `companyName` String, 기본값: GitHub, Inc
|
||||
* `submitUrl` String, 기본값: http://54.249.141.255:1127/post
|
||||
* 크래시 리포트는 POST 방식으로 이 URL로 전송됩니다.
|
||||
* `autoSubmit` Boolean, 기본값: true
|
||||
* true로 지정할 경우 유저의 승인 없이 자동으로 오류를 보고합니다.
|
||||
* `ignoreSystemCrashHandler` Boolean, 기본값: false
|
||||
* `extra` Object
|
||||
* 크래시 리포트 시 같이 보낼 추가 정보를 지정하는 객체입니다.
|
||||
* 문자열로 된 속성만 정상적으로 보내집니다.
|
||||
* 중첩 객체는 지원되지 않습니다. (Nested objects are not supported)
|
||||
|
||||
다른 crashReporter API들을 사용하기 전에 이 함수를 먼저 호출해야 합니다.
|
||||
|
||||
다른 crashReporter API를 사용하기 전에 이 메서드를 먼저 호출해야 합니다.
|
||||
|
||||
**알림:** OS X에선 Windows와 Linux의 `breakpad`와 달리 새로운 `crashpad` 클라이언트를 사용합니다.
|
||||
오류 수집 기능을 활성화 시키려면 오류를 수집하고 싶은 메인 프로세스나 랜더러 프로세스에서
|
||||
`crashReporter.start` 함수를 호출하여 `crashpad`를 초기화 해야합니다.
|
||||
`crashReporter.start` 메서드를 호출하여 `crashpad`를 초기화 해야합니다.
|
||||
|
||||
## crashReporter.getLastCrashReport()
|
||||
### `crashReporter.getLastCrashReport()`
|
||||
|
||||
마지막 오류보고의 날짜와 ID를 반환합니다.
|
||||
이전 오류보고가 없거나 Crash Reporter가 시작되지 않았을 경우 `null`이 반환됩니다.
|
||||
마지막 크래시 리포트의 날짜와 ID를 반환합니다.
|
||||
이전 크래시 리포트가 없거나 Crash Reporter가 시작되지 않았을 경우 `null`이 반환됩니다.
|
||||
|
||||
## crashReporter.getUploadedReports()
|
||||
### `crashReporter.getUploadedReports()`
|
||||
|
||||
모든 업로드된 오류보고를 반환합니다. 각 보고는 날짜와 업로드 ID를 포함하고 있습니다.
|
||||
모든 업로드된 크래시 리포트를 반환합니다. 각 보고는 날짜와 업로드 ID를 포함하고 있습니다.
|
||||
|
||||
# crash-reporter 오류보고 형식
|
||||
## crash-reporter 업로드 형식
|
||||
|
||||
Crash Reporter는 다음과 같은 데이터를 `submitUrl`에 `POST` 방식으로 전송합니다:
|
||||
|
||||
|
|
@ -56,5 +63,5 @@ Crash Reporter는 다음과 같은 데이터를 `submitUrl`에 `POST` 방식으
|
|||
* `_productName` String - Crash Reporter의 `options` 객체에서 정의한 제품명.
|
||||
* `prod` String - 기본 제품의 이름. 이 경우 Electron으로 표시됩니다.
|
||||
* `_companyName` String - Crash Reporter의 `options` 객체에서 정의한 회사명.
|
||||
* `upload_file_minidump` File - 오류보고 파일
|
||||
* `upload_file_minidump` File - 크래시 리포트 파일
|
||||
* Crash Reporter의 `options` 객체에서 정의한 `extra` 객체의 속성들.
|
||||
|
|
|
|||
|
|
@ -1,34 +1,39 @@
|
|||
# dialog
|
||||
|
||||
`dialog` 모듈은 네이티브 시스템의 대화 상자를 조작할 때 사용할 수 있는 API입니다.
|
||||
웹 어플리케이션에서 일반 네이티브 어플리케이션과 같은 사용자 경험을 제공할 수 있습니다.
|
||||
`dialog` 모듈은 파일 열기, 알림과 같은 네이티브 시스템의 대화 상자를 조작할 때 사용할 수 있는 모듈입니다.
|
||||
이 모듈을 사용하면 웹 어플리케이션에서 일반 네이티브 어플리케이션과 비슷한 사용자 경험을 제공할 수 있습니다.
|
||||
|
||||
다음 예제는 파일과 디렉터리를 다중으로 선택하는 대화 상자를 표시하는 예제입니다:
|
||||
|
||||
```javascript
|
||||
var win = ...; // 대화 상자를 사용할 창 객체
|
||||
var win = ...; // 대화 상자를 사용할 BrowserWindow 객체
|
||||
var dialog = require('dialog');
|
||||
console.log(dialog.showOpenDialog({ properties: [ 'openFile', 'openDirectory', 'multiSelections' ]}));
|
||||
```
|
||||
|
||||
**OS X 주의**: 대화 상자를 시트처럼 보여지게 하려면 `browserWindow` 인자에 `BrowserWindow` 객체의 참조를 제공하면 됩니다.
|
||||
**OS X 알림**: 대화 상자를 시트처럼 보여지게 하려면 `browserWindow` 인자에 `BrowserWindow` 객체의 참조를 제공하면 됩니다.
|
||||
|
||||
## dialog.showOpenDialog([browserWindow], [options], [callback])
|
||||
## Methods
|
||||
|
||||
* `browserWindow` BrowserWindow
|
||||
* `options` Object
|
||||
`dialog` 모듈은 다음과 같은 메서드를 가지고 있습니다:
|
||||
|
||||
### `dialog.showOpenDialog([browserWindow][, options][, callback])`
|
||||
|
||||
* `browserWindow` BrowserWindow (optional)
|
||||
* `options` Object (optional)
|
||||
* `title` String
|
||||
* `defaultPath` String
|
||||
* `filters` Array
|
||||
* `properties` Array - 대화 상자가 사용할 기능(모드)이 담긴 배열입니다.
|
||||
다음을 포함할 수 있습니다: `openFile`, `openDirectory`, `multiSelections`, `createDirectory`
|
||||
* `callback` Function
|
||||
* `callback` Function (optional)
|
||||
|
||||
사용할 대화 상자의 기능이 담긴 배열입니다. 다음을 포함할 수 있습니다: `openFile`, `openDirectory`, `multiSelections`, `createDirectory`
|
||||
|
||||
작업에 성공하면 유저가 선택한 파일의 경로를 포함한 배열을 반환합니다. 그 외의 경우엔 `undefined`를 반환합니다.
|
||||
작업에 성공하면 콜백으로 유저가 선택한 파일의 경로를 포함한 배열을 반환합니다. 그 외엔 `undefined`를 반환합니다.
|
||||
|
||||
`filters`를 지정하면 유저가 선택 가능한 파일 형식을 지정할 수 있습니다. 예제는 다음과 같습니다:
|
||||
`filters`를 지정하면 유저가 선택 가능한 파일 형식을 지정할 수 있습니다.
|
||||
유저가 선택할 수 있는 타입에 제한을 두려면 다음과 같이 할 수 있습니다:
|
||||
|
||||
```javascript
|
||||
{
|
||||
|
|
@ -42,32 +47,30 @@ console.log(dialog.showOpenDialog({ properties: [ 'openFile', 'openDirectory', '
|
|||
```
|
||||
|
||||
`extensions` 배열은 반드시 와일드카드와 마침표를 제외한 파일 확장자를 포함시켜야 합니다.
|
||||
예를 들어 `'png'`는 가능하지만 `'.png'`와 `'*.png'`는 안됩니다.
|
||||
(예를 들어 `'png'`는 가능하지만 `'.png'`와 `'*.png'`는 안됩니다)
|
||||
모든 파일을 보여주려면 `'*'`와 같은 와일드카드를 사용하면 됩니다. (다른 와일드카드는 지원하지 않습니다)
|
||||
|
||||
`callback`이 전달되면 메소드가 비동기로 작동되며 결과는 `callback(filenames)`을 통해 전달됩니다.
|
||||
|
||||
Windows와 Linux에선 파일 선택 모드, 디렉터리 선택 모드를 동시에 사용할 수 없습니다.
|
||||
그래서 이 두 플랫폼에선 `properties`를 `['openFile', 'openDirectory']`로 설정하면 디렉터리 선택 대화 상자가 표시됩니다.
|
||||
**알림:** Windows와 Linux에선 파일 선택 모드, 디렉터리 선택 모드를 동시에 사용할 수 없습니다.
|
||||
이러한 이유로 `properties`를 `['openFile', 'openDirectory']`로 설정하면 디렉터리 선택 대화 상자가 표시됩니다.
|
||||
|
||||
## dialog.showSaveDialog([browserWindow], [options], [callback])
|
||||
### `dialog.showSaveDialog([browserWindow][, options][, callback])`
|
||||
|
||||
* `browserWindow` BrowserWindow
|
||||
* `options` Object
|
||||
* `browserWindow` BrowserWindow (optional)
|
||||
* `options` Object (optional)
|
||||
* `title` String
|
||||
* `defaultPath` String
|
||||
* `filters` Array
|
||||
* `callback` Function
|
||||
* `callback` Function (optional)
|
||||
|
||||
작업에 성공하면
|
||||
|
||||
작업에 성공하면 유저가 선택한 파일의 경로를 포함한 배열을 반환합니다. 그 외의 경우엔 `undefined`를 반환합니다.
|
||||
작업에 성공하면 콜백으로 유저가 선택한 파일의 경로를 포함한 배열을 반환합니다. 그 외엔 `undefined`를 반환합니다.
|
||||
|
||||
`filters`를 지정하면 유저가 저장 가능한 파일 형식을 지정할 수 있습니다. 사용 방법은 `dialog.showOpenDialog`의 `filters` 속성과 같습니다.
|
||||
|
||||
`callback`이 전달되면 메소드가 비동기로 작동되며 결과는 `callback(filename)`을 통해 전달됩니다.
|
||||
|
||||
## dialog.showMessageBox([browserWindow], options, [callback])
|
||||
### `dialog.showMessageBox([browserWindow][, options][, callback])`
|
||||
|
||||
* `browserWindow` BrowserWindow
|
||||
* `options` Object
|
||||
|
|
@ -78,26 +81,26 @@ Windows와 Linux에선 파일 선택 모드, 디렉터리 선택 모드를 동
|
|||
* `message` String - 대화 상자의 본문 내용입니다.
|
||||
* `detail` String - 메시지의 추가 정보입니다.
|
||||
* `icon` [NativeImage](native-image.md)
|
||||
* `cancelId` Integer - 유저가 대화 상자의 버튼을 클릭하지 않고 대화 상자를 취소했을 때 반환되는 버튼의 index입니다.
|
||||
기본적으로 버튼 리스트가 "cancel" 또는 "no" 라벨을 가지고 있을 때 해당 버튼의 index를 반환합니다. 따로 두 라벨이 지정되지 않은 경우 0을 반환합니다.
|
||||
* `cancelId` Integer - 유저가 대화 상자의 버튼을 클릭하지 않고 대화 상자를 취소했을 때 반환되는 버튼의 인덱스입니다.
|
||||
기본적으로 버튼 리스트가 "cancel" 또는 "no" 라벨을 가지고 있을 때 해당 버튼의 인덱스를 반환합니다. 따로 두 라벨이 지정되지 않은 경우 0을 반환합니다.
|
||||
OS X와 Windows에선 `cancelId` 지정 여부에 상관없이 "Cancel" 버튼이 언제나 `cancelId`로 지정됩니다.
|
||||
* `noLink` Boolean - Windows Electron은 "Cancel"이나 "Yes"와 같은 흔히 사용되는 버튼을 찾으려고 시도하고
|
||||
대화 상자 내에서 해당 버튼을 커맨드 링크처럼 만듭니다. 이 기능으로 앱을 좀 더 Modern Windows 앱처럼 만들 수 있습니다.
|
||||
이 기능을 원하지 않으면 `noLink`를 true로 지정하면 됩니다.
|
||||
* `callback` Function
|
||||
|
||||
대화 상자를 표시합니다. `browserWindow`를 지정하면 대화 상자가 완전히 닫힐 때까지는 창을 사용할 수 없습니다.
|
||||
완료시 유저가 선택한 버튼의 index를 반환합니다.
|
||||
대화 상자를 표시합니다. `browserWindow`를 지정하면 대화 상자가 완전히 닫힐 때까지 지정한 창을 사용할 수 없습니다.
|
||||
완료 시 유저가 선택한 버튼의 인덱스를 반환합니다.
|
||||
|
||||
역주: 부정을 표현하는 "아니오", "취소"와 같은 한글 단어는 지원되지 않습니다.
|
||||
만약 OS X 또는 Windows에서 "확인", "취소"와 같은 순서로 버튼을 지정하게 될 때 Alt + f4로 해당 대화 상자를 끄게 되면 "확인"을 누른걸로 판단되어 버립니다.
|
||||
만약 OS X 또는 Windows에서 "확인", "취소"와 같은 순서로 버튼을 지정하게 될 때 Alt + f4로 해당 대화 상자를 끄게 되면 "확인"을 누른 것으로 판단되어 버립니다.
|
||||
이를 해결하려면 "Cancel"을 대신 사용하거나 BrowserWindow API를 사용하여 대화 상자를 직접 구현해야합니다.
|
||||
|
||||
`callback`이 전달되면 메소드가 비동기로 작동되며 결과는 `callback(response)`을 통해 전달됩니다.
|
||||
|
||||
## dialog.showErrorBox(title, content)
|
||||
### `dialog.showErrorBox(title, content)`
|
||||
|
||||
에러 메시지를 보여주는 모달 대화 상자를 표시합니다.
|
||||
에러 메시지를 보여주는 대화 상자를 표시합니다.
|
||||
|
||||
이 API는 `app` 모듈의 `ready` 이벤트가 발생하기 전에 사용할 수 있습니다.
|
||||
이 메소드는 보통 어플리케이션이 시작되기 전에 특정한 에러를 표시하기 위해 사용됩니다.
|
||||
|
|
|
|||
|
|
@ -1,9 +1,10 @@
|
|||
# `File` 객체
|
||||
|
||||
DOM의 File 인터페이스는 네이티브 파일을 추상화 합니다. 유저가 직접적으로 HTML5 File API를 사용하여 작업할 때 파일의 경로를
|
||||
알 수 있도록 Electron은 파일시스템의 실제 파일 경로를 담은 `path` 속성을 File 인터페이스에 추가하였습니다.
|
||||
DOM의 File 인터페이스는 네이티브 파일을 추상화 합니다.
|
||||
유저가 직접 HTML5 File API를 이용하여 작업할 때 선택된 파일의 경로를 알 수 있도록
|
||||
Electron은 파일의 실제 경로를 담은 `path` 속성을 File 인터페이스에 추가하였습니다.
|
||||
|
||||
다음 예제는 drag n drop한 파일의 실제 경로를 가져옵니다:
|
||||
다음 예제는 앱으로 드래그 앤 드롭한 파일의 실제 경로를 가져옵니다:
|
||||
|
||||
```html
|
||||
<div id="holder">
|
||||
|
|
|
|||
|
|
@ -1,10 +1,12 @@
|
|||
# Frameless 윈도우
|
||||
# Frameless Window
|
||||
|
||||
Frameless 윈도우는 테두리가 없는 윈도우 창을 말합니다.
|
||||
Frameless Window는 [테두리](https://developer.mozilla.org/en-US/docs/Glossary/Chrome)가 없는 창입니다.
|
||||
이 기능은 윈도우 창의 일부분인 툴바와 같이 웹 페이지의 일부분이 아닌 부분을 보이지 않도록 합니다.
|
||||
[`BrowserWindow`](browser-window.md) 클래스의 옵션에서 설정할 수 있습니다.
|
||||
|
||||
## Frameless 윈도우 만들기
|
||||
## Frameless Window 만들기
|
||||
|
||||
Frameless 윈도우를 만드려면 [BrowserWindow](browser-window.md) 객체의 `options`에서 `frame` 옵션을 `false`로 지정하기만 하면됩니다:
|
||||
Frameless Window를 만드려면 [BrowserWindow](browser-window.md) 객체의 `options`에서 `frame` 옵션을 `false`로 지정하면 됩니다:
|
||||
|
||||
```javascript
|
||||
var BrowserWindow = require('browser-window');
|
||||
|
|
@ -13,7 +15,7 @@ var win = new BrowserWindow({ width: 800, height: 600, frame: false });
|
|||
|
||||
## 투명한 창 만들기
|
||||
|
||||
Frameless 윈도우의 창의 배경을 투명하게 만들고 싶다면 `transparent` 옵션을 `true`로 바꿔주기만 하면됩니다:
|
||||
Frameless Window의 창의 배경을 투명하게 만들고 싶다면 `transparent` 옵션을 `true`로 바꿔주기만 하면됩니다:
|
||||
|
||||
```javascript
|
||||
var win = new BrowserWindow({ transparent: true, frame: false });
|
||||
|
|
@ -21,22 +23,20 @@ var win = new BrowserWindow({ transparent: true, frame: false });
|
|||
|
||||
### API의 한계
|
||||
|
||||
|
||||
|
||||
* 투명한 영역을 통과하여 클릭할 수 없습니다. 우리는 이 문제를 해결하기 위해 API를 제공할 예정이지만 현재로써는
|
||||
* 투명한 영역을 통과하여 클릭할 수 없습니다. 우리는 이 문제를 해결하기 위해 API를 제공할 예정이었지만 현재로써는
|
||||
[upstream 버그](https://code.google.com/p/chromium/issues/detail?id=387234)로 인해 중단된 상태입니다.
|
||||
* 투명한 창은 크기를 조절할 수 없습니다. `resizable` 속성을 `true`로 할 경우 몇몇 플랫폼에선 윈도우 크래시가 일어납니다.
|
||||
* `blur` 필터는 웹 페이지에서만 적용됩니다. 윈도우 아래 컨텐츠에는 블러 효과를 적용할 방법이 없습니다.
|
||||
* Windows에선 DWM(데스크톱 창 관리자)가 비활성화되어 있을 경우 작동하지 않습니다.
|
||||
* Linux를 사용할 경우 [alpha channel doesn't work on some NVidia drivers](https://code.google.com/p/chromium/issues/detail?id=369209)
|
||||
upstream 버그가 있으므로 CLI 옵션에 `--enable-transparent-visuals --disable-gpu`을 추가해야 합니다.
|
||||
* 투명한 창은 크기를 조절할 수 없습니다. `resizable` 속성을 `true`로 할 경우 몇몇 플랫폼에선 크래시가 일어납니다.
|
||||
* `blur` 필터는 웹 페이지에서만 적용됩니다. 윈도우 아래 컨텐츠에는 블러 효과를 적용할 방법이 없습니다. (예시: 유저의 시스템에 열린 다른 어플리케이션)
|
||||
* Windows에선 DWM(데스크톱 창 관리자)가 비활성화되어 있을 경우 투명한 창이 작동하지 않습니다.
|
||||
* Linux를 사용할 경우 [alpha channel doesn't work on some NVidia drivers](https://code.google.com/p/chromium/issues/detail?id=369209)
|
||||
upstream 버그가 있는 관계로 투명한 창 기능을 사용하려면 CLI 옵션에 `--enable-transparent-visuals --disable-gpu`을 추가해야 합니다.
|
||||
이 옵션은 GPU의 사용을 중단하고 윈도우를 생성하는데 ARGB를 사용할 수 있도록 해줍니다.
|
||||
* OS X(Mac)에선 네이티브 윈도우의 그림자가 투명한 창에선 보이지 않습니다.
|
||||
* OS X(Mac)에선 네이티브 창에서 보여지는 그림자가 투명한 창에선 보이지 않습니다.
|
||||
|
||||
## 드래그 가능 위치 지정
|
||||
|
||||
기본적으로 Frameless 윈도우는 드래그 할 수 없습니다.
|
||||
어플리케이션의 CSS에서 특정 범위를 `-webkit-app-region: drag`로 지정하면 OS의 기본 타이틀바 처럼 드래그 되도록 할 수 있습니다.
|
||||
기본적으로 Frameless Window는 드래그 할 수 없습니다.
|
||||
어플리케이션의 CSS에서 특정 범위를 `-webkit-app-region: drag`로 지정하면 OS의 기본 타이틀 바 처럼 드래그 되도록 할 수 있습니다.
|
||||
그리고 `-webkit-app-region: no-drag`를 지정해서 드래그 불가능 영역을 만들 수도 있습니다. 현재 사각형 형태의 범위만 지원합니다.
|
||||
|
||||
창 전체를 드래그 가능하게 만드려면 `-webkit-app-region: drag`을 `body`의 스타일에 지정하면 됩니다:
|
||||
|
|
@ -54,13 +54,13 @@ button {
|
|||
}
|
||||
```
|
||||
|
||||
또한 커스텀 타이틀바를 만들어 사용할 때 타이틀바 내부의 버튼도 드래그 불가능 영역으로 지정해야 합니다.
|
||||
따로 커스텀 타이틀 바를 만들어 사용할 때는 타이틀 바 내부의 모든 버튼을 드래그 불가능 영역으로 지정해야 합니다.
|
||||
|
||||
## 텍스트 선택
|
||||
|
||||
한가지, Frameless 윈도우에서 텍스트가 선택되는 드래그 동작은 혼란을 야기할 수 있습니다.
|
||||
예를 들어 타이틀바를 드래그 할 때 타이틀바의 텍스트를 실수로 선택할 수 있습니다.
|
||||
이를 방지하기 위해선 다음과 같이 드래그 영역의 텍스트 선택 동작을 비활성화해야 할 필요가 있습니다:
|
||||
Frameless Window에서 텍스트가 선택되는 드래그 동작은 혼란을 야기할 수 있습니다.
|
||||
예를 들어 타이틀 바를 드래그 할 때 타이틀 바의 텍스트를 실수로 선택할 수 있습니다.
|
||||
이를 방지하기 위해 다음과 같이 드래그 영역의 텍스트 선택 기능을 비활성화해야 할 필요가 있습니다:
|
||||
|
||||
```css
|
||||
.titlebar {
|
||||
|
|
@ -71,5 +71,5 @@ button {
|
|||
|
||||
## 컨텍스트 메뉴
|
||||
|
||||
몇몇 플랫폼에선 드래그 가능 영역이 non-client 프레임으로 처리됩니다. 그래서 이 영역에서 오른쪽 클릭을 할 경우 시스템 메뉴가 팝업 됩니다.
|
||||
그래서 컨텍스트 메뉴 지정이 모든 플랫폼에서 정상적으로 작동하게 하려면 커스텀 컨텍스트 메뉴를 드래그 영역 내에 만들어선 안됩니다.
|
||||
몇몇 플랫폼에선 드래그 가능 영역이 non-client 프레임으로 처리됩니다. 이러한 플랫폼에선 드래그 가능 영역에서 오른쪽 클릭 할 경우 시스템 메뉴가 팝업 됩니다.
|
||||
이러한 이유로 컨텍스트 메뉴 지정 시 모든 플랫폼에서 정상적으로 작동하게 하려면 커스텀 컨텍스트 메뉴를 드래그 영역 내에 만들어선 안됩니다.
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
### new MenuItem(options)
|
||||
|
||||
* `options` Object
|
||||
* `click` Function - 메뉴 아이템이 클릭될 때 호출되는 콜백함수
|
||||
* `click` Function - 메뉴 아이템이 클릭될 때 호출되는 콜백 함수
|
||||
* `selector` String - First Responder가 클릭될 때 호출 되는 선택자 (OS X 전용)
|
||||
* `type` String - `MenuItem`의 타입 `normal`, `separator`, `submenu`, `checkbox` 또는 `radio` 사용가능
|
||||
* `label` String
|
||||
|
|
|
|||
|
|
@ -181,9 +181,9 @@ Menu.setApplicationMenu(menu);
|
|||
* `action` String
|
||||
|
||||
`action`을 어플리케이션의 first responder에 전달합니다.
|
||||
이 함수는 Cocoa 메뉴 동작을 에뮬레이트 하는데 사용되며 보통 `MenuItem`의 `selector` 속성에 사용됩니다.
|
||||
이 메서드는 Cocoa 메뉴 동작을 에뮬레이트 하는데 사용되며 보통 `MenuItem`의 `selector` 속성에 사용됩니다.
|
||||
|
||||
**알림:** 이 함수는 OS X에서만 사용할 수 있습니다.
|
||||
**알림:** 이 메서드는 OS X에서만 사용할 수 있습니다.
|
||||
|
||||
### Class Method: Menu.buildFromTemplate(template)
|
||||
|
||||
|
|
|
|||
|
|
@ -20,8 +20,8 @@ win.loadUrl('https://github.com');
|
|||
|
||||
## Remote 객체
|
||||
|
||||
`remote` 모듈로부터 반환된 각 객체(함수 포함)는 메인 프로세스의 객체를 추상화 한 객체입니다. (우리는 그것을 remote 객체 또는 remote 함수라고 부릅니다)
|
||||
Remote 모듈의 함수를 호출하거나, 객체에 접근하거나, 생성자로 객체를 생성하는 등의 작업은 실질적으로 동기형 inter-process 메시지를 보냅니다.
|
||||
`remote` 모듈로부터 반환된 각 객체(메서드 포함)는 메인 프로세스의 객체를 추상화 한 객체입니다. (우리는 그것을 remote 객체 또는 remote 함수라고 부릅니다)
|
||||
Remote 모듈의 메서드를 호출하거나, 객체에 접근하거나, 생성자로 객체를 생성하는 등의 작업은 실질적으로 동기형 inter-process 메시지를 보냅니다.
|
||||
|
||||
위의 예제에서 사용한 두 `BrowserWindow`와 `win`은 remote 객체입니다. 그리고 `new BrowserWindow`이 생성하는 `BrowserWindow` 객체는 랜더러 프로세스에서 생성되지 않습니다.
|
||||
대신에 이 `BrowserWindow` 객체는 메인 프로세스에서 생성되며 랜더러 프로세스에 `win` 객체와 같이 이에 대응하는 remote 객체를 반환합니다.
|
||||
|
|
@ -38,16 +38,45 @@ Remote 객체가 GC 되려면 대응하는 메인 프로세스 내부 객체의
|
|||
|
||||
## 메인 프로세스로 콜백 넘기기
|
||||
|
||||
몇몇 메인 프로세스의 API는 콜백 함수를 사용합니다. 그리고 보통 remote 함수를 호출할 때 콜백 함수를 넘길 것입니다.
|
||||
`remote` 모듈은 이를 지원합니다. 하지만 반드시 주의해서 사용해야 합니다.
|
||||
메인 프로세스의 코드는 `remote` 모듈을 통해 랜더러 프로세스가 전달하는 콜백 함수를 받을 수 있습니다.
|
||||
하지만 이 작업은 반드시 주의를 기울여 사용해야 합니다.
|
||||
|
||||
첫째, 데드락을 피하기 위해 메인 프로세스로 전달된 콜백들은 비동기로 호출됩니다.
|
||||
그래서 전달된 콜백들이 언제나 값을 반환할 것이라고 기대하면 안 됩니다.
|
||||
이러한 이유로 메인 프로세스로 전달된 콜백들의 반환 값을 내부 함수에서 언제나 정상적으로 받을 것이라고 예측해선 안됩니다.
|
||||
|
||||
둘째, 콜백들은 메인 프로세스로 전송되고 호출된 후에도 자동으로 참조가 릴리즈 되지 않습니다.
|
||||
참조는 메인 프로세스에서 GC가 일어나기 전까지 계속 남아있게 됩니다.
|
||||
예를 들어 메인 프로세스에서 `Array.map` 같은 메서드를 사용할 때 랜더러 프로세스에서 전달된 함수를 사용해선 안됩니다:
|
||||
|
||||
다음 코드를 보면 느낌이 팟 하고 올 것입니다. 이 예제는 remote 객체에 `close` 이벤트 콜백을 설치합니다:
|
||||
```javascript
|
||||
// mapNumbers.js 메인 프로세스
|
||||
exports.withRendererCallback = function(mapper) {
|
||||
return [1,2,3].map(mapper);
|
||||
}
|
||||
|
||||
exports.withLocalCallback = function() {
|
||||
return exports.mapNumbers(function(x) {
|
||||
return x + 1;
|
||||
});
|
||||
}
|
||||
|
||||
// 랜더러 프로세스
|
||||
var mapNumbers = require("remote").require("mapNumbers");
|
||||
|
||||
var withRendererCb = mapNumbers.withRendererCallback(function(x) {
|
||||
return x + 1;
|
||||
})
|
||||
|
||||
var withLocalCb = mapNumbers.withLocalCallback()
|
||||
|
||||
console.log(withRendererCb, withLocalCb) // [true, true, true], [2, 3, 4]
|
||||
```
|
||||
|
||||
보다시피 랜더러 콜백의 동기 반환 값은 예상되지 않은 처리입니다.
|
||||
그리고 메인 프로세스에서 처리한 함수의 반환 값과 일치하지 않습니다.
|
||||
|
||||
둘째, 콜백들은 메인 프로세스로 전달, 호출된 이후에도 자동으로 함수의 참조가 릴리즈 되지 않습니다.
|
||||
함수 참조는 메인 프로세스에서 GC가 일어나기 전까지 계속 프로세스에 남아있게 됩니다.
|
||||
|
||||
다음 코드를 보면 느낌이 올 것입니다. 이 예제는 remote 객체에 `close` 이벤트 콜백을 설치합니다:
|
||||
|
||||
```javascript
|
||||
var remote = require('remote');
|
||||
|
|
@ -56,11 +85,14 @@ remote.getCurrentWindow().on('close', function() {
|
|||
});
|
||||
```
|
||||
|
||||
문제는 이 이벤트는 명시적으로 제거하지 않는 이상 계속해서 메인 프로세스에 남아있게 된다는 것입니다.
|
||||
그래서 매 창을 새로고침 할 때마다 콜백이 새롭게 설치되며 이전 콜백은 떨궈져 누수가 됩니다.
|
||||
설상가상으로 이전에 설치한 콜백의 콘텍스트가 릴리즈 되고 나서 `close` 이벤트가 발생하면 예외가 발생하고 메인 프로세스가 작동 중지됩니다.
|
||||
하지만 이 코드 처럼 이벤트를 명시적으로 제거하지 않는 이상 콜백 함수의 참조가 계속해서 메인 프로세스에 남아있게 됩니다.
|
||||
만약 명시적으로 콜백을 제거하지 않으면 매 번 창을 새로고침 할 때마다 콜백을 새로 설치합니다.
|
||||
게다가 이전 콜백이 제거되지 않고 계속해서 쌓이면서 메모리 누수가 발생합니다.
|
||||
|
||||
일반적으로 정확히 무엇을 할 것인지 잘 알고 있지 않는 이상 웬만하면 메인 프로세스로 콜백 함수를 넘기는 건 자제하는 게 좋습니다.
|
||||
설상가상으로 이전에 설치된 콜백의 콘텍스트가 릴리즈 되고 난 후(예: 페이지 새로고침) `close` 이벤트가 발생하면 예외가 발생하고 메인 프로세스가 작동 중지됩니다.
|
||||
|
||||
이러한 문제를 피하려면 랜더러 프로세스에서 메인 프로세스로 넘긴 함수의 참조를 사용 후 확실하게 제거해야 합니다.
|
||||
작업 후 이벤트 콜백을 포함하여 책임 있게 함수의 참조를 제거하거나 메인 프로세스에서 랜더러 프로세스가 종료될 때 내부적으로 함수 참조를 제거하도록 설계해야 합니다.
|
||||
|
||||
## remote.require(module)
|
||||
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
# web-frame
|
||||
|
||||
`web-frame` 모듈은 현재 웹 페이지의 랜더링 상태를 설정 할 수 있도록 해줍니다.
|
||||
`web-frame` 모듈은 현재 웹 페이지의 랜더링 상태를 설정 할 수 있도록 관련 유틸리티를 제공하는 모듈입니다.
|
||||
|
||||
다음 예제는 현재 페이지를 200% 줌 합니다.
|
||||
다음 예제는 현재 페이지를 200% 줌 합니다:
|
||||
|
||||
```javascript
|
||||
var webFrame = require('web-frame');
|
||||
|
|
@ -30,6 +30,13 @@ webFrame.setZoomFactor(2);
|
|||
|
||||
현재 줌 레벨을 반환합니다.
|
||||
|
||||
## webFrame.setZoomLevelLimits(minimumLevel, maximumLevel)
|
||||
|
||||
* `minimumLevel` Number
|
||||
* `maximumLevel` Number
|
||||
|
||||
줌 레벨의 최대, 최소치를 지정합니다.
|
||||
|
||||
## webFrame.setSpellCheckProvider(language, autoCorrectWord, provider)
|
||||
|
||||
* `language` String
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# `window.open` 함수
|
||||
# `window.open` 메서드
|
||||
|
||||
`window.open` 함수가 호출되면 새 창에서 새로운 페이지를 불러옵니다.
|
||||
`window.open` 메서드가 호출되면 새 창에서 새로운 페이지를 불러옵니다.
|
||||
이 창은 `url`로 부터 만들어진 `BrowserWindow`의 새 인스턴스이며 본 객체 대신 페이지의 컨트롤이 제한된 프록시 객체를 반환합니다.
|
||||
|
||||
프록시 객체는 기존의 웹 페이지와 호환될 수 있도록 일부 제한된 표준 기능만 가지고 있습니다.
|
||||
|
|
@ -54,4 +54,4 @@ Forcefully closes the child window without calling its unload event.
|
|||
|
||||
자식 윈도우에 메시지를 보냅니다. 특정한 origin을 지정할 수도 있으며 `*`를 지정하면 따로 origin 설정을 사용하지 않습니다.
|
||||
|
||||
참고로 자식 윈도우의 `window.opener` 객체에는 다른 속성 없이 이 함수 하나만 구현되어 있습니다.
|
||||
참고로 자식 윈도우의 `window.opener` 객체에는 다른 속성 없이 이 메서드 한 개만 구현되어 있습니다.
|
||||
|
|
|
|||
|
|
@ -72,6 +72,15 @@ python script\cpplint.py
|
|||
python script\test.py
|
||||
```
|
||||
|
||||
테스트 실행시 `runas`와 같은 네이티브 모듈을 포함하는데 이 모듈은 디버그 빌드에서 같이 사용할 수 없습니다.
|
||||
하지만 여전히 릴리즈 빌드에선 사용할 수 있습니다.
|
||||
|
||||
릴리즈 빌드로 테스트를 실행하려면 다음 커맨드를 사용하면 됩니다:
|
||||
|
||||
```powershell
|
||||
python script\test.py -R
|
||||
```
|
||||
|
||||
## 문제 해결
|
||||
|
||||
### Command xxxx not found
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# 디버거에서 디버그 심볼 서버 설정
|
||||
|
||||
디버그 심볼은 디버깅 세션을 더 좋게 개선해 줍니다. 디버그 심볼은 실행 파일과 동적 링크 라이브러리에서 함수에 대한 정보를 담고 있으며 명료한 함수 호출 스텍 정보를 제공합니다.
|
||||
디버그 심볼은 디버깅 세션을 더 좋게 개선해 줍니다. 디버그 심볼은 실행 파일과 동적 링크 라이브러리에서 메서드에 대한 정보를 담고 있으며 명료한 함수 호출 스텍 정보를 제공합니다.
|
||||
심볼 서버는 유저가 크기가 큰 디버깅용 파일을 필수적으로 다운로드 받지 않고도 디버거가 알맞은 심볼, 바이너리 그리고 소스를 자동적으로 로드할 수 있도록 해줍니다.
|
||||
서버 사용법은 [Microsoft의 심볼 서버](http://support.microsoft.com/kb/311503)와 비슷합니다. 이 문서를 참조하세요.
|
||||
|
||||
|
|
|
|||
|
|
@ -1,61 +1,55 @@
|
|||
# Electron Documentation Styleguide
|
||||
# Electron 문서 스타일 가이드
|
||||
|
||||
Find the appropriate section for your task: [reading Electron documentation](#)
|
||||
or [writing Electron documentation](#).
|
||||
[Electron 문서 읽기](#) 와 [Electron 문서 작성하기](#) 중 적당히 필요한 부분을 찾아 참고하세요:
|
||||
|
||||
## Writing Electron Documentation
|
||||
## Electron 문서 작성하기
|
||||
|
||||
These are the ways that we construct the Electron documentation.
|
||||
Electron 문서를 작성하는 규칙은 다음과 같습니다.
|
||||
|
||||
- Maximum one `h1` title per page.
|
||||
- Use `bash` instead of `cmd` in code blocks (because of syntax highlighter).
|
||||
- Doc `h1` titles should match object name (i.e. `browser-window` ¡æ
|
||||
`BrowserWindow`).
|
||||
- Hyphen separated filenames, however, are fine.
|
||||
- No headers following headers, add at least a one-sentence description.
|
||||
- Methods headers are wrapped in `code` ticks.
|
||||
- Event headers are wrapped in single 'quotation' marks.
|
||||
- No nesting lists more than 2 levels (unfortunately because of markdown
|
||||
renderer).
|
||||
- Add section titles: Events, Class Methods and Instance Methods.
|
||||
- Use 'will' over 'would' when describing outcomes.
|
||||
- Events and methods are `h3` headers.
|
||||
- Optional arguments written as `function (required[, optional])`.
|
||||
- Optional arguments are denoted when called out in list.
|
||||
- Line length is 80-column wrapped.
|
||||
- Platform specific methods are noted in italics following method header.
|
||||
- `h1` 제목은 페이지당 한 개만 사용할 수 있습니다.
|
||||
- 코드 블럭에서 터미널 언어 선택시 `cmd` 대신 `bash`를 사용합니다. (syntax highlighter를 사용하기 위해서)
|
||||
- 문서의 `h1` 제목은 반드시 현재 객체 이름과 같게 해야 합니다. (예시: `browser-window` → `BrowserWindow`)
|
||||
- 하이픈(-)으로 구분되었던 어떻게 되었던 간에 예시와 같이 작성합니다.
|
||||
- 헤더 밑에 헤더를 바로 사용하지 않습니다. 한 줄이라도 좋으니 헤더와 헤더 사이에 설명 추가합니다.
|
||||
- 메서드 헤더는 `code` 틱으로 표시합니다.
|
||||
- 이벤트 헤더는 한 '따옴표'로 표시합니다.
|
||||
- 리스트를 2 단계 이상 중첩하지 않습니다. (안타깝게도 markdown 랜더러가 지원하지 않습니다)
|
||||
- 섹션에 대한 제목을 추가합니다: Events, Class 메서드 그리고 인스턴스 메서드등.
|
||||
- 어떤 '것'의 사용 결과를 설명할 때 '될 것입니다' 형식을 사용하여 설명합니다.
|
||||
- 이벤트와 메서드에는 `h3` 헤더를 사용합니다.
|
||||
- 선택적 인수는 `function (required[, optional])` 형식으로 작성합니다.
|
||||
- 선택적 인수는 목록에서 호출되면 표시합니다.
|
||||
- 문장의 길이는 한 줄당 80 칸을 유지합니다.
|
||||
- 플랫폼 특정 메서드 헤더는 이탈릭체로 표시합니다.
|
||||
- ```### `method(foo, bar)` _OS X_```
|
||||
|
||||
## Reading Electron Documentation
|
||||
## Electron 문서 읽기
|
||||
|
||||
Here are some tips for understanding Electron documentation syntax.
|
||||
Electron 문서 구조를 이해하는 데 참고할 수 있는 유용한 도움말입니다.
|
||||
|
||||
### Methods
|
||||
|
||||
An example of [method](https://developer.mozilla.org/en-US/docs/Glossary/Method)
|
||||
documentation:
|
||||
[Method](https://developer.mozilla.org/en-US/docs/Glossary/Method) 문서의 예제입니다:
|
||||
|
||||
---
|
||||
|
||||
`methodName(required[, optional]))`
|
||||
|
||||
* `require` String, **required**
|
||||
* `require` String, **필수**
|
||||
* `optional` Integer
|
||||
|
||||
---
|
||||
|
||||
The method name is followed by the arguments it takes. Optional arguments are
|
||||
notated by brackets surrounding the optional argument as well as the comma
|
||||
required if this optional argument follows another argument.
|
||||
메서드 이름은 인수가 무엇을 받는지에 따라 결정됩니다. 선택적 인수는 브라켓([, ])으로 묶어
|
||||
이 인수가 다른 인수뒤에 선택적으로 사용할 수 있다는 것을 설명합니다.
|
||||
|
||||
Below the method is more detailed information on each of the arguments. The type
|
||||
of argument is notated by either the common types: [`String`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String), [`Number`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number), [`Object`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object), [`Array`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)
|
||||
or a custom type like Electron's [`webContent`](api/web-content.md).
|
||||
메서드의 밑에선 각 인수에 대해 자세한 설명을 합니다. 인수의 타입은 일반적인 타입 중 하나를 받거나:
|
||||
[`String`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String), [`Number`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number), [`Object`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object), [`Array`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)
|
||||
Electron의 [`webContent`](api/web-content.md)같은 커스텀 타입을 받습니다.
|
||||
|
||||
### Events
|
||||
|
||||
An example of [event](https://developer.mozilla.org/en-US/docs/Web/API/Event)
|
||||
documentation:
|
||||
[Event](https://developer.mozilla.org/en-US/docs/Web/API/Event) 문서의 예제입니다:
|
||||
|
||||
---
|
||||
|
||||
|
|
@ -67,12 +61,11 @@ Returns:
|
|||
|
||||
---
|
||||
|
||||
The event is a string that is used after a `.on` listener method. If it returns
|
||||
a value it and its type is noted below. If you were to listen and respond to
|
||||
this event it might look something like this:
|
||||
이벤트는 `.on` 리스너 메서드로 사용할 수 있습니다. 만약 이벤트에서 값을 반환한다면 문서에서 표시된 대로
|
||||
일정한 타입의 값을 반환합니다. 이벤트를 처리하거나 응답하려 한다면 다음과 같이 사용할 수 있습니다:
|
||||
|
||||
```javascript
|
||||
Alarm.on('wake-up', function(time) {
|
||||
console.log(time)
|
||||
})
|
||||
```
|
||||
```
|
||||
|
|
|
|||
|
|
@ -118,7 +118,7 @@ originalFs.readFileSync('/path/to/example.asar');
|
|||
몇몇 API는 시스템의 실제 파일의 경로를 기반으로 작동하므로 이 API들을 사용할 땐 Electron은
|
||||
이 API가 원할하게 작동할 수 있도록 하기 위해 임시경로에 해당 파일들의 압축을 해제합니다. 이 작업은 약간의 오버헤드를 불러 일으킬 수 있습니다.
|
||||
|
||||
해당하는 API 함수는 다음과 같습니다:
|
||||
해당하는 API 메서드는 다음과 같습니다:
|
||||
|
||||
* `child_process.execFile`
|
||||
* `fs.open`
|
||||
|
|
|
|||
|
|
@ -1,25 +1,23 @@
|
|||
# 네이티브 node 모듈 사용하기
|
||||
|
||||
__역주: 현재 Electron은 node.js대신 io.js를 사용합니다. 문서에 기재된 버전과 다를 수 있습니다__
|
||||
|
||||
Electron에선 node.js 네이티브 모듈이 지원됩니다. 하지만 Electron은 공식 node.js의 V8 엔진과는 달리 다른 V8 버전을 사용합니다.
|
||||
그런 이유로 네이티브 모듈을 사용하기 위해선 Electron의 V8 버전에 맞춰 네이티브 모듈을 다시 빌드하고 헤더를 변경해야 합니다.
|
||||
Electron에선 node.js 네이티브 모듈이 지원됩니다. 하지만 Electron은 공식 node.js의 V8 엔진과는 다른 V8 버전을 사용합니다.
|
||||
이러한 이유로 네이티브 모듈을 사용하기 위해선 Electron의 V8 버전에 맞춰 네이티브 모듈을 다시 빌드하고 헤더를 변경해야 합니다.
|
||||
|
||||
## 네이티브 node 모듈 호환성
|
||||
|
||||
Node v0.11.x 버전부터는 V8 API의 중대한 변경이 있었습니다. 하지만 일반적으로 모든 네이티브 모듈은 Node v0.10.x 버전을 타겟으로 작성 되었기 때문에
|
||||
Node v0.11.x 버전에선 작동하지 않습니다. Electron은 내부적으로 Node v0.11.13 버전을 사용합니다. 그래서 위에서 설명한 문제가 발생합니다.
|
||||
Node v0.11.x 버전부터는 V8 API의 중대한 변경이 있었습니다. 하지만 대부분의 네이티브 모듈은 Node v0.10.x 버전을 타겟으로 작성 되었기 때문에
|
||||
새로운 Node 또는 io.js 버전에서 작동하지 않을 수 있습니다. Electron은 내부적으로 __io.js v3.1.0__ 버전을 사용하기 때문에 이러한 호환성 문제가 발생할 수 있습니다.
|
||||
|
||||
이 문제를 해결하기 위해 모듈이 Node v0.11.x 버전을 지원할 수 있도록 해야합니다.
|
||||
현재 [많은 모듈들](https://www.npmjs.org/browse/depended/nan)이 안정적으로 두 버전 모두 지원하고 있지만 오래된 모듈의 경우 Node v0.10.x 버전만을 지원하고 있습니다.
|
||||
예를 들어 [nan](https://github.com/rvagg/nan) 모듈을 사용해야 하는 경우 Node v0.11.x 버전으로 포팅 할 필요가 있습니다.
|
||||
이 문제를 해결하기 위해선 모듈이 v0.11.x 또는 최신 버전을 지원할 수 있도록 변경해야 합니다.
|
||||
현재 [많은 모듈들](https://www.npmjs.org/browse/depended/nan)이 안정적으로 두 버전 모두 지원하고 있지만 오래된 모듈의 경우 여전히 Node v0.10.x 버전만을 지원하고 있습니다.
|
||||
예를 들어 [nan](https://github.com/rvagg/nan) 모듈을 사용해야 한다면 Node v0.11.x 또는 최신 버전의 Node와 io.js로 포팅 할 필요가 있습니다.
|
||||
|
||||
## 네이티브 모듈 설치하는 방법
|
||||
|
||||
### 쉬운 방법 - 권장
|
||||
|
||||
[`electron-rebuild`](https://github.com/paulcbetts/electron-rebuild) 패키지를 사용하면 아주 빠르고 정확하게 네이티브 모듈을 다시 빌드할 수 있습니다.
|
||||
다음의 간단한 절차를 통해 자동으로 헤더를 다운로드하고 네이티브 모듈을 빌드할 수 있습니다:
|
||||
[`electron-rebuild`](https://github.com/paulcbetts/electron-rebuild) 패키지를 사용하면 빠르고 간단하게 네이티브 모듈을 다시 빌드할 수 있습니다.
|
||||
간단한 절차를 통해 자동으로 헤더를 다운로드하고 네이티브 모듈을 빌드할 수 있습니다:
|
||||
|
||||
```sh
|
||||
npm install --save-dev electron-rebuild
|
||||
|
|
@ -30,7 +28,7 @@ npm install --save-dev electron-rebuild
|
|||
|
||||
### node-gyp을 이용한 방법
|
||||
|
||||
Node 모듈을 `node-gyp`를 사용하여 Electron을 타겟으로 빌드할 땐 `node-gyp`에 헤더 다운로드 주소와 버전을 알려주어야합니다:
|
||||
Node 모듈을 `node-gyp`를 사용하여 Electron을 타겟으로 빌드할 때는 `node-gyp`에 헤더 다운로드 주소와 버전을 알려주어야 합니다:
|
||||
|
||||
```bash
|
||||
$ cd /path-to-module/
|
||||
|
|
@ -43,7 +41,7 @@ $ HOME=~/.electron-gyp node-gyp rebuild --target=0.29.1 --arch=x64 --dist-url=ht
|
|||
### npm을 이용한 방법
|
||||
|
||||
또한 `npm`을 사용하여 모듈을 설치할 수도 있습니다.
|
||||
환경변수가 필요한 것을 제외하고는 일반 Node 모듈을 설치하는 방법과 완전히 똑같습니다:
|
||||
환경변수가 필요한 것을 제외하고 일반 Node 모듈을 설치하는 방법과 완전히 똑같습니다:
|
||||
|
||||
```bash
|
||||
export npm_config_disturl=https://atom.io/download/atom-shell
|
||||
|
|
|
|||
|
|
@ -8,11 +8,11 @@ generated file to view the result.
|
|||
```javascript
|
||||
var contentTracing = require('content-tracing');
|
||||
|
||||
tracing.startRecording('*', tracing.DEFAULT_OPTIONS, function() {
|
||||
contentTracing.startRecording('*', contentTracing.DEFAULT_OPTIONS, function() {
|
||||
console.log('Tracing started');
|
||||
|
||||
setTimeout(function() {
|
||||
tracing.stopRecording('', function(path) {
|
||||
contentTracing.stopRecording('', function(path) {
|
||||
console.log('Tracing data recorded to ' + path);
|
||||
});
|
||||
}, 5000);
|
||||
|
|
|
|||
Loading…
Reference in a new issue