NW.JS는 Chromium을 기반으로하기 때문에 NW.JS 응용 프로그램의 테스트 및 디버깅을 수동으로 수행 할 수 있습니다. Karma의 NW.JS 런처 플러그인 (Karma-Nodewebkit-Launcher)을 사용하여 자동화 된 장치 테스트를 구현할 수 있습니다.
이 기사는 Tim Severien과 Joan Yin이 검토했습니다. Sitepoint의 콘텐츠를 완벽하게 만들어 주신 Sitepoint의 모든 동료 검토 자에게 감사드립니다!
nw
nw-builder
package.json
<.> 뷰포트 제어. 예를 들어, 고정 또는 최소/최대 뷰포트를 정의 할 수 있습니다.
-
파일 시스템에 액세스 하드웨어 액세스 (예 : 프린터 목록 가져 오기) 팔레트 아이콘 -
쉘 통합 (기본 파일 브라우저 또는 브라우저에서 파일 또는 URL 열기)
전체 창 (닫기 버튼, 메뉴 막대) 및 컨텍스트 메뉴를 사용자 정의하는 옵션 줌 레벨을 설정하고 얻는 기능. - 좋은 소리? 그런 다음 시작합시다. 이 기사에서는 실제로 NW.JS에 대해 배우고 하이브리드 응용 프로그램을 만드는 방법을 배웁니다. GitHub 의이 기사의 지침을 사용하여 구축 된 샘플 응용 프로그램을 찾을 수 있습니다.
전자와 비교하여 NW.JS의 장점 우선, 한 가지 언급 : NW.JS만이 하이브리드 애플리케이션을위한 유일한 프레임 워크는 아닙니다. 다른 경쟁자를 전자라고합니다. NW.JS보다 2 년 뒤에 2013 년에 시작되었지만 Github에서 나왔기 때문에 빨리 잘 알려졌습니다. 이제 당신은 그들 사이의 차이에 관심이있을 수 있습니다. 전자와 비교하여 NW.JS의 장점은 다음과 같습니다. - <.> chrome.* API. 이 API는 브라우저와 상호 작용하는 데 사용될 수 있습니다. (NW.JS 문서에서 더 많은 관련 정보를 찾을 수 있습니다.)
Chrome 앱을 지원합니다. Chrome 앱은 웹 언어로 작성된 패키지 응용 프로그램입니다. (자세한 내용은 Chrome Developer 문서를 참조하십시오.) 이러한 응용 프로그램은 Node.js 통합이없고 Chrome Web Store를 사용하여 게시되기 때문에 NW.JS와 다릅니다. (Chromium은 2018 년 8 월까지 지원을 취소 할 것입니다 (블로그 게시물 참조). 그러나이 게시물에 따르면 NW.JS는 여전히 Chrome 앱을 지원합니다.) 는 NACL (기본 클라이언트) 및 PNACL (휴대용 원시 클라이언트) 응용 프로그램을 지원합니다. 그들은 성능에 중점을 두므로 주로 C와 C로 작성됩니다. (NW.Js.에서 사용하는 방법은이 자습서를 참조하십시오. 에는 응용 프로그램의 소스 코드를 보호하기위한 V8 스냅 샷 소스 코드 보호 기능이 있습니다. NWJC 도구를 사용하면 코드가 기본 코드로 컴파일됩니다. (자세한 내용은이 기사를 참조하십시오.) 에는 PDF 뷰어가 내장되어 있습니다.
미리보기를 인쇄하십시오. 는 웹 워커에서 node.js의 통합을 지원합니다. 그것들은 멀티 스레드 응용 프로그램을 작성하는 데 사용됩니다. 그러나 Electron은 또한 언급 할 가치가있는 몇 가지 이점이 있습니다. 는 충돌 보고서를 원격 서버에 자동으로 보냅니다. NW.JS는 로컬 파일에만 기록한 다음 수동으로 제출할 수 있습니다.
반면에, 전자 애플리케이션은 JavaScript 파일을 입력 지점으로 지정합니다. 이 JavaScript 파일은 별도의 기본 프로세스에서 열리고 HTML 파일을 GUI에서 열 수 있습니다. 이것은 이론적으로 GUI없이 전자 응용 프로그램을 실행할 수 있음을 의미합니다. 또한 GUI를 닫으면 API 메소드를 호출하여 수동으로 종료해야합니다.
참고 : Electron의 장점이 마음에 들면 Electron을 사용하여 데스크탑 응용 프로그램 작성에 대한 SitePoint의 최근 기사를 확인하십시오.
프로젝트 구조
먼저 프로젝트 구조와 파일을 만들어야합니다.
<: :> 지침 : > src/는 응용 프로그램의 소스 파일을 포함합니다.
/> src/ app/에는 JavaScript 파일이 포함되어 있습니다.
SRC/ ASSETS/ 이미지가 포함되어 있습니다. 이 예에서는 파일 icon.png (창 아이콘으로 표시 될) 만 정사각형이어야합니다.> src/ styles/ 일반적으로 SCSS 이하의 파일이 포함되어 있습니다.이 예에서는 간단한 CSS 파일 일뿐입니다.
> src/ views/ HTML보기 파일이 포함되어 있습니다.> src/package.json은 nw.js 응용 프로그램의 매니페스트 파일입니다 (Manifest 형식 참조). 또한 여기에 응용 프로그램의 종속성을 지정합니다.
package.json은 빌드 워크 플로우를 수행하고 실제 NW.JS 응용 프로그램 (예 : 빌딩 종속성)에 필요하지 않은 종속성을 지정 해야하는 NPM 패키지 파일입니다.<code>nw.js-example/ ├── src/ │ ├── app/ │ │ └── main.js │ ├── assets/ │ │ └── icon.png │ ├── styles/ │ │ └── common.css │ ├── views/ │ │ └── main.html │ └── package.json └── package.json</code>
목록을 작성하십시오
-
그게 다야! 기본 경로는 매니페스트 파일과 관련이 있으므로 응용 프로그램은 나중에 시작시 SRC/Views/Main.html을 시작합니다.
- 홈 뷰를 만듭니다 이 시점에서 우리는 할 일 신청서를 작성할 수 있습니다. 그러나 우리는 NW.JS와 그 기능에 집중하고 싶습니다. 이를 위해 you
- 가 앱이 무엇을하는지 결정하게하는 것을 선호합니다. GitHub에서 Project NW.JS-Examples 예제를 만들어 Node.js 통합 및 클립 보드 액세스와 같은 몇 가지 NW.JS 기능을 시연했습니다. 응용 프로그램에서 자유롭게 시도하십시오. 그러나 다른 콘텐츠도 사용할 수 있습니다.
- 이 단축키는 NW 패키지를 사용하여 DEV의 스크립트에서 정의한 명령을 호출합니다. SRC/Views/Main.html을 보여주는 개발 시스템에서 새 창을 직접 열어야합니다.
- 생산 구조
프로덕션 빌드는 Windows, Linux 및 MacOS의 출력을 지원하는 NW 빌더를 사용합니다. 이 예에서는 32 비트 및 64 비트 버전을 포함하여 이러한 모든 플랫폼에 대한 패키지를 구축했습니다. MACOS의 경우 현재 32 비트 만 기존 버전 모드에서 구축 할 수 있습니다. (Github 에서이 질문을 참조하십시오.) 따라서 64 비트 만 구축됩니다.
<code>nw.js-example/ ├── src/ │ ├── app/ │ │ └── main.js │ ├── assets/ │ │ └── icon.png │ ├── styles/ │ │ └── common.css │ ├── views/ │ │ └── main.html │ └── package.json └── package.json</code>그런 다음
<.> NW.JS 를 설치하십시오
완료! 구축합시다.
결론
선호하는 모델은 무엇입니까? 또는 NW.JS 응용 프로그램을 개발하기 위해 어떤 기술을 선택합니까? 이 기사에서 할 일지 애플리케이션 구현 대신 NW.JS 예제를 사용하는 것이 효과적입니까? 의견에 알려주십시오.
nw.js는 다양한 플랫폼을 지원합니다. Windows, Mac 및 Linux 용 응용 프로그램을 개발하는 데 사용할 수 있습니다. 이 크로스 플랫폼 지원은 개발자가 한 번에 코드를 작성하고 여러 플랫폼에서 실행할 수 있기 때문에 NW.JS를 사용하는 데있어 주요 장점 중 하나입니다.
예, NW.JS는 Node.js를 통해 기본 API에 직접 액세스 할 수 있습니다. 즉, 애플리케이션에서 파일 시스템, 네트워크, 장치 등과 같은 기본 기능을 사용할 수 있습니다. 이것은 전통적인 웹 기술에 대한 NW.JS의 주요 장점입니다. <code>{
"name":"nw.js-example",
"main":"views/main.html",
"window":{
"min_width":400,
"min_height":400,
"icon":"assets/icon.png"
}
}</code>
이렇게하려면 다음 두 가지 패키지가 필요합니다.
<.> nw.js를 직접 실행하십시오
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>NW.js-example | main</title>
<link rel="stylesheet" href="../styles/common.css">
</head>
<body>
<h1 id="Hello-World">Hello World :-)</h1>
<🎜>
</body>
</html> <a href="https://www.php.cn/link/58c1dbad4977b4c106bca8015477757e">Something</a>
<code>nw.js-example/
├── src/
│ ├── app/
│ │ └── main.js
│ ├── assets/
│ │ └── icon.png
│ ├── styles/
│ │ └── common.css
│ ├── views/
│ │ └── main.html
│ └── package.json
└── package.json</code>
이 개정 된 출력은 원래 이미지 배치 및 형식, 독창성을위한 문장 및 단락을 유지하면서 더 간결하고 영향력있는 언어를 사용합니다.
위 내용은 NW.JS로 크로스 플랫폼 데스크탑 앱 구축의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
JavaScript로 문자열 문자를 교체하십시오Mar 11, 2025 am 12:07 AMJavaScript 문자열 교체 방법 및 FAQ에 대한 자세한 설명 이 기사는 JavaScript에서 문자열 문자를 대체하는 두 가지 방법 인 내부 JavaScript 코드와 웹 페이지의 내부 HTML을 탐색합니다. JavaScript 코드 내부의 문자열을 교체하십시오 가장 직접적인 방법은 대체 () 메소드를 사용하는 것입니다. str = str.replace ( "find", "replace"); 이 메소드는 첫 번째 일치 만 대체합니다. 모든 경기를 교체하려면 정규 표현식을 사용하고 전역 플래그 g를 추가하십시오. str = str.replace (/fi
자신의 Ajax 웹 응용 프로그램을 구축하십시오Mar 09, 2025 am 12:11 AM그래서 여기 당신은 Ajax라는이 일에 대해 배울 준비가되어 있습니다. 그러나 정확히 무엇입니까? Ajax라는 용어는 역동적이고 대화식 웹 컨텐츠를 만드는 데 사용되는 느슨한 기술 그룹을 나타냅니다. 원래 Jesse J에 의해 만들어진 Ajax라는 용어
10 JQuery Fun 및 Games 플러그인Mar 08, 2025 am 12:42 AM10 재미있는 jQuery 게임 플러그인 웹 사이트를보다 매력적으로 만들고 사용자 끈적함을 향상시킵니다! Flash는 여전히 캐주얼 웹 게임을 개발하기위한 최고의 소프트웨어이지만 JQuery는 놀라운 효과를 만들 수 있으며 Pure Action Flash 게임과 비교할 수는 없지만 경우에 따라 브라우저에서 예기치 않은 재미를 가질 수 있습니다. jQuery tic 발가락 게임 게임 프로그래밍의 "Hello World"에는 이제 jQuery 버전이 있습니다. 소스 코드 jQuery Crazy Word Composition 게임 이것은 반은 반은 게임이며, 단어의 맥락을 알지 못해 이상한 결과를 얻을 수 있습니다. 소스 코드 jQuery 광산 청소 게임
내 자신의 JavaScript 라이브러리를 어떻게 작성하고 게시합니까?Mar 18, 2025 pm 03:12 PM기사는 JavaScript 라이브러리 작성, 게시 및 유지 관리, 계획, 개발, 테스트, 문서 및 홍보 전략에 중점을 둡니다.
jQuery 시차 자습서 - 애니메이션 헤더 배경Mar 08, 2025 am 12:39 AM이 튜토리얼은 jQuery를 사용하여 매혹적인 시차 배경 효과를 만드는 방법을 보여줍니다. 우리는 멋진 시각적 깊이를 만드는 계층화 된 이미지가있는 헤더 배너를 만들 것입니다. 업데이트 된 플러그인은 jQuery 1.6.4 이상에서 작동합니다. 다운로드
브라우저에서 성능을 위해 JavaScript 코드를 최적화하려면 어떻게해야합니까?Mar 18, 2025 pm 03:14 PM이 기사는 브라우저에서 JavaScript 성능을 최적화하기위한 전략에 대해 설명하고 실행 시간을 줄이고 페이지로드 속도에 미치는 영향을 최소화하는 데 중점을 둡니다.
Matter.js : 소개를 시작합니다Mar 08, 2025 am 12:53 AMMatter.js는 JavaScript로 작성된 2D 강성 신체 물리 엔진입니다. 이 라이브러리를 사용하면 브라우저에서 2D 물리학을 쉽게 시뮬레이션 할 수 있습니다. 그것은 단단한 몸체를 생성하고 질량, 면적 또는 밀도와 같은 물리적 특성을 할당하는 능력과 같은 많은 기능을 제공합니다. 중력 마찰과 같은 다양한 유형의 충돌 및 힘을 시뮬레이션 할 수도 있습니다. Matter.js는 모든 주류 브라우저를 지원합니다. 또한, 터치를 감지하고 반응이 좋기 때문에 모바일 장치에 적합합니다. 이러한 모든 기능을 사용하면 엔진 사용 방법을 배울 수있는 시간이 필요합니다. 이는 물리 기반 2D 게임 또는 시뮬레이션을 쉽게 만들 수 있습니다. 이 튜토리얼에서는 설치 및 사용을 포함한이 라이브러리의 기본 사항을 다루고
jQuery 및 Ajax를 사용한 자동 새로 고침 DIV 컨텐츠Mar 08, 2025 am 12:58 AM이 기사에서는 jQuery 및 Ajax를 사용하여 5 초마다 DIV의 컨텐츠를 자동으로 새로 고치는 방법을 보여줍니다. 이 예제는 RSS 피드의 최신 블로그 게시물을 마지막 새로 고침 타임 스탬프와 함께 가져오고 표시합니다. 로딩 이미지는 선택 사항입니다
핫 AI 도구
Undresser.AI Undress
사실적인 누드 사진을 만들기 위한 AI 기반 앱
AI Clothes Remover
사진에서 옷을 제거하는 온라인 AI 도구입니다.
Undress AI Tool
무료로 이미지를 벗다
Clothoff.io
AI 옷 제거제
AI Hentai Generator
AI Hentai를 무료로 생성하십시오.
인기 기사
R.E.P.O. 에너지 결정과 그들이하는 일 (노란색 크리스탈)
2 몇 주 전By尊渡假赌尊渡假赌尊渡假赌
스플릿 소설을이기는 데 얼마나 걸립니까?
1 몇 달 전ByDDD
R.E.P.O. 최고의 그래픽 설정
2 몇 주 전By尊渡假赌尊渡假赌尊渡假赌
어 ass 신 크리드 그림자 : 조개 수수께끼 솔루션
1 몇 주 전ByDDD
R.E.P.O. 아무도들을 수없는 경우 오디오를 수정하는 방법
3 몇 주 전By尊渡假赌尊渡假赌尊渡假赌
뜨거운 도구
드림위버 CS6
시각적 웹 개발 도구
Eclipse용 SAP NetWeaver 서버 어댑터
Eclipse를 SAP NetWeaver 애플리케이션 서버와 통합합니다.
mPDF
mPDF는 UTF-8로 인코딩된 HTML에서 PDF 파일을 생성할 수 있는 PHP 라이브러리입니다. 원저자인 Ian Back은 자신의 웹 사이트에서 "즉시" PDF 파일을 출력하고 다양한 언어를 처리하기 위해 mPDF를 작성했습니다. HTML2FPDF와 같은 원본 스크립트보다 유니코드 글꼴을 사용할 때 속도가 느리고 더 큰 파일을 생성하지만 CSS 스타일 등을 지원하고 많은 개선 사항이 있습니다. RTL(아랍어, 히브리어), CJK(중국어, 일본어, 한국어)를 포함한 거의 모든 언어를 지원합니다. 중첩된 블록 수준 요소(예: P, DIV)를 지원합니다.
PhpStorm 맥 버전
최신(2018.2.1) 전문 PHP 통합 개발 도구
Dreamweaver Mac版
시각적 웹 개발 도구
