<span>npm install electron-prebuilt -g </span>
이 응용 프로그램은 최종 프로젝트를 생성하는 것이 아니라 최종 프로젝트를 번들링하고 실행하는 데만 사용됩니다. 이를 위해 표준 텍스트 편집기 또는 IDE를 사용할 수 있습니다.
<span>npm install electron-prebuilt -g </span>
brew <span>install Caskroom/cask/electron </span>
코드를 '기본'응용 프로그램으로 포장하는 것은 간단하지만 몇 가지 조각이 필요합니다. 먼저 응용 프로그램 배지의 아이콘. 이것의 모양과 파일 유형은 타겟팅하는 운영 체제에 따라 다르지만 Marvel의 공식 Android 앱에서 가져온 아이콘은 다음과 같습니다.
<p> </p>
<are> 참고 : 우리는 여기에 예시적인 목적으로 저작권이있는 Marvel 속성을 사용하고 있습니다. 그들을 자신의 것으로 배포하지 마십시오! <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><span>'use strict';
</span>
<span>const electron = require('electron');
</span><span>const app = electron.app; // Module to control application life.
</span><span>const BrowserWindow = electron.<span>BrowserWindow</span>; // Module to create native browser window.
</span><span>var mainWindow = null;
</span></pre><div class="contentsignin">로그인 후 복사</div></div>
그런 다음 <ic> 그런 다음 iconverticons.com/online/을 사용하여 PNG를 Mac 아이콘 파일로 변환했지만 사용 가능한 다른 도구가 있습니다. <p>
<est> 프로젝트를 패키지하는 가장 간단한 방법은 Electron-Packager NPM 모듈을 사용하는 것입니다 (참고 : 별도로 설치해야 함). 데스크탑 앱의 경우 큰 이진을 생성 할 수 있습니다. 이것은 문제가되지 않을 수 있지만 다른 옵션이 여기에 설명되어 있습니다.
<pack> 윈도우가 아닌 플랫폼에서 Windows를 포장하는 경우 와인을 설치해야합니다.
<s> 그 경고를 제쳐두고, 애플리케이션 바이너리를 만드는 방법은 다음과 같습니다. 프로젝트 폴더에서 run (</s></pack></est></p> 프로젝트의 관련 값으로 )을 대체합니다.
<p>
<these> 순서 대로이 매개 변수는 다음을 설정합니다<ul>
<der> 프로젝트 폴더
<application> 생성 된 응용 프로그램 이름.
<these these> 플랫폼 : Windows 용 Win32, Linux, Vanilla Mac OS X 용 Darwin 및 Mac App Store 릴리스 용 MAS입니다. 모두 설정하면 모든 플랫폼에 이진이 생성됩니다
32 및 64 비트 CPU 아키텍처의 경우 아키텍처 : IA32 및 X64 또는 전부.
<version> 사용할 전자 버전
<b> 출력 바이너리 위치 및 기존 파일을 덮어 쓰기 위해.
<to> 사용 아이콘
<li>
<param> 참고 : 모든 매개 변수는 여러 값에 대해 쉼표를 분리 할 수 있으며 모든 플랫폼과 아키텍처를 생성하려면 관련 매개 변수를 -all.
</li> <li>
</li> 추가 단계
<simple> 이것은 전자의 잠재력을 설명하는 간단한 예였으며 훨씬 더 많은 것이 가능합니다. 순수한 JavaScript로 달성 할 수있는 것을 제외하고는 다음을 살펴볼 수 있습니다.
<li>
<sub> Mac App Store 제출
Chrome Dev 도구 사용 <dev dev>
<.> 클립 보드 액세스.
<menu menu> 응용 프로그램 메뉴 표시 줄 도구 만들기
<new> 전자의 새로운 대화식 API 탐색기
Devtron, 특히 전자 개발을위한 Chrome Dev 도구로의 확장.
<li>
<ical> 여전히 회의적입니까? 이 기사를 Atom에서 작성하는 동안 Slack 에서이 기사의 편집자와 의사 소통하고 Kitematic에서 생성 된 Docker 컨테이너의 응용 프로그램을 테스트했음을 지적하고 싶습니다. 이 모든 것은 전자 생성 된 응용 분야입니다. 좋아, 그들은 그들의 문제가 있지만, 그것은 매우 인상적입니다! </ical>
</li>
<to> 아래 주석에서 전자로 구축 한 응용 프로그램에 대해 듣고 싶습니다.
<questions> Electron <li>가있는 데스크탑 노드 앱에 대해 자주 묻는 질문입니다
<pr> 전자를 사용하여 데스크탑 앱을 개발하기위한 전제 조건은 무엇입니까? </pr>
</li> 전자를 사용하여 데스크탑 애플리케이션을 개발하기 전에 시스템에 Node.js 및 NPM (Node 패키지 관리자)이 설치되어 있어야합니다. Node.js는 서버 또는 컴퓨터에서 JavaScript를 실행할 수있는 JavaScript 런타임이며 NPM은 Node.js 패키지의 패키지 관리자입니다. 공식 Node.js 웹 사이트에서 Node.js 및 NPM을 다운로드 할 수 있습니다. 이 설치 한 후에는 NPM을 사용하여 전자를 설치할 수 있습니다. <li> 내 시스템에 전자를 설치하려면 어떻게해야합니까? </li> <li> 전자 설치는 매우 간단합니다. Node.js 및 NPM이 설치되면 터미널 또는 명령 프롬프트에 다음 명령을 사용하여 시스템에 전자 전자를 설치할 수 있습니다. NPM 설치 -G 전자. 이 명령은 전 세계적으로 전자를 설치하므로 시스템의 모든 디렉토리에서 액세스 할 수 있습니다.<create> 새로운 전자 프로젝트를 만드는 방법 <h3> </h3> 새로운 전자 프로젝트를 만들려면 먼저 프로젝트에 대한 새 디렉토리를 만듭니다. 터미널 또는 명령 프롬프트 에서이 디렉토리로 이동 한 다음 NPM init 명령을 사용하여 새 node.js 프로젝트를 초기화하십시오. 이 명령은 프로젝트 디렉토리에 새 package.json 파일을 만듭니다. 그런 다음 명령 NPM 설치 -Save Electron을 사용하여 프로젝트에 전자를 설치할 수 있습니다. 전자 응용 프로그램의 구조는 무엇입니까? <p> </p> 전자 애플리케이션은 일반적으로 세 가지 유형의 파일로 구성됩니다. package.json, main.js 및 index.html. package.json 파일에는 응용 프로그램 및 해당 종속성에 대한 메타 데이터가 포함되어 있습니다. Main.js 파일은 응용 프로그램의 진입 점으로 응용 프로그램의 수명주기 이벤트를 제어 할 수 있습니다. index.html 파일은 응용 프로그램이 시작될 때 표시되는 웹 페이지입니다. <h3> </h3> 전자 애플리케이션을 어떻게 실행합니까? <p> </p> 전자 애플리케이션을 실행하려면 프로젝트 디렉토리로 이동하십시오. 터미널 또는 명령 프롬프트를 사용한 다음 명령 전자를 사용하십시오.이 명령은 응용 프로그램을 시작합니다. <h3> </h3> 분포를위한 전자 응용 프로그램을 어떻게 포장 할 수 있습니까? <p> </p> 분배를 위해 전자 애플리케이션을 포장하려면, 당신 Electron-Packager 또는 Electron-Builder와 같은 모듈을 사용할 수 있습니다. 이 모듈은 다양한 플랫폼에서 실행할 수있는 실행 파일로 응용 프로그램을 패키지 할 수 있습니다. <h3> 전자 응용 프로그램에서 node.js 모듈을 사용할 수 있습니까? </h3> 예, Node를 사용할 수 있습니다. 전자 응용 프로그램의 .js 모듈. Electron은 Node.js 런타임을 사용하므로 응용 프로그램에서 Node.js 모듈을 사용할 수 있습니다. <p> 전자 애플리케이션에서 웹 기술을 사용할 수 있습니까? </p> <h3> 예, 웹 기술을 사용할 수 있습니다. 전자 적용. Electron은 본질적으로 HTML, CSS 및 JavaScript와 같은 웹 기술을 사용하여 데스크톱 응용 프로그램을 만들 수있는 웹 브라우저입니다. </h3> 전자 애플리케이션을 어떻게 디버깅 할 수 있습니까? <p> </p> 전자 애플리케이션을 디버깅 할 수 있습니다. 크롬 개발자 도구 사용. Electron은 Chromium을 기반으로하므로 응용 프로그램을 디버깅하는 데 사용할 수있는 내장 개발자 도구가 포함되어 있습니다. <h3> 전자를 사용하여 크로스 플랫폼 애플리케이션을 구축 할 수 있습니까? </h3> 예, 가능합니다. 전자를 사용하여 크로스 플랫폼 응용 프로그램을 구축하십시오. Electron은 Windows, MacOS 및 Linux에서 실행되는 응용 프로그램을 구축 할 수 있습니다.</create>
</li></questions></to></new>
</menu></.></dev></sub>
</li></simple></to></b></version></these></application></der>
</ul></these></p></ic></are>위 내용은 전자로 크로스 플랫폼 데스크톱 노드 앱을 만듭니다의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
