Jhipster Angular 생성 응용 프로그램에서 전자를 사용하는 방법은 무엇입니까?

모하메드 후센 탈 레브

방금 전자를 발견했고 흥미 롭다는 것을 알았으므로 jhipster angular 프로젝트 (최신 jhipster 버전)에서 구현하고 싶습니다.

이 튜토리얼을 따라 시도하고 수정했지만 Jhipster가 Webpack을 사용하기 때문에 내 빌드가 좋지 않다고 생각합니다.

여기 내가 한 일이 있습니다

다음과 같이 src / main / webapp 폴더 main.js 파일을 선언했습니다.

const { app, BrowserWindow } = require("electron");
const path = require("path");
const url = require("url");

let win;

function createWindow() {
  win = new BrowserWindow({ width: 800, height: 600 });

  // load the dist folder from Angular
  win.loadURL(
    url.format({
      pathname: path.join(__dirname, `/dist/index.html`),
      protocol: "file:",
      slashes: true
    })
  );

  // The following is optional and will open the DevTools:
  // win.webContents.openDevTools()

  win.on("closed", () => {
    win = null;
  });
}

app.on("ready", createWindow);

// on macOS, closing the window doesn't quit the app
app.on("window-all-closed", () => {
  if (process.platform !== "darwin") {
    app.quit();
  }
});

// initialize the app's main window
app.on("activate", () => {
  if (win === null) {
    createWindow();
  }
});

그런 다음 아래 구성 파일을 업데이트하려고 시도했습니다.

package.json

{
  "name": "boxing",
  "version": "0.0.1-SNAPSHOT",
  "main": "main.js", <-- added this
  "description": "Description for boxing",
  "private": true,
  "license": "UNLICENSED",
  "cacheDirectories": [
    "node_modules"
  ],
  "dependencies": {
    "@angular-devkit/build-angular": "^0.803.14", <-- installed using npm
    ...
  "scripts": {
    "electron": "ng build --base-href ./ && electron .",

angular.json

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
  "projects": {
    "boxing": {
      "root": "",
      "sourceRoot": "src/main/webapp",
      "projectType": "application",
      "schematics": {
        "@schematics/angular:component": {
          "skipTests": true,
          "style": "scss"
        },
        "@schematics/angular:directive": {
          "skipTests": true
        },
        "@schematics/angular:guard": {
          "skipTests": true
        },
        "@schematics/angular:pipe": {
          "skipTests": true
        },
        "@schematics/angular:service": {
          "skipTests": true
        }
      },
      "prefix": "jhi",
      "architect": {
        <-- added this lines
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            "outputPath": "dist"
          }
        }
       <-- end of add
      }
    }
  },
  "defaultProject": "boxing",
  "cli": {
    "packageManager": "npm"
  }
}

마침내 index.html href를 ./로 업데이트 했습니다 .

하지만 터미널에서 명령을 실행하면이 오류가 발생합니다.

npm 실행 전자

[email protected] electron / home / housseyn / Desktop / projects / salle-de-sport ng build --base-href ./ && electron.

다음 오류로 인해 스키마 유효성 검사에 실패했습니다. 데이터 경로 ""에 필수 속성 'main'이 있어야합니다. npm 오류! 코드 ELIFECYCLE npm ERR! errno 1 npm ERR! [email protected] 전자 : ng build --base-href ./ && electron .npm ERR! 종료 상태 1 npm ERR! npm 오류! [email protected] 전자 스크립트에서 실패했습니다. npm 오류! 이것은 아마도 npm의 문제가 아닙니다. 위의 추가 로깅 출력이있을 수 있습니다.

npm 오류! 이 실행에 대한 전체 로그는 npm ERR!에서 찾을 수 있습니다. /home/housseyn/.npm/_logs/2019-10-25T16_00_19_675Z-debug.log

수카이나 엘 하 유니

npm run electron-build패키지에 스크립트에 추가 한 후이 명령 사용하여 프로젝트를 빌드 해야합니다.

문서를 끝까지 확인

도움이 되길 바랍니다.

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

특정 응용 프로그램에서 소리를 비활성화하는 방법은 무엇입니까?

분류에서Dev

느린 Office 응용 프로그램 interop 생성자를 디버깅하는 방법은 무엇입니까?

분류에서Dev

응용 프로그램에서 QuickBlox 사용자 태그를 삭제하는 방법은 무엇입니까?

분류에서Dev

Jhipster 엔티티 하위 생성기 : Gradle을 사용하여 Prod에서 Liquibase DELTA 변경 로그를 만드는 방법은 무엇입니까?

분류에서Dev

Angular 2 응용 프로그램에서 npm을 사용하여 툴팁에 qtip2를 설치하는 방법은 무엇입니까?

분류에서Dev

타사 응용 프로그램에서 사용하기 위해 일부 Windows 10 전역 단축키 만 비활성화하는 방법은 무엇입니까?

분류에서Dev

Angular js를 사용하여 다중 페이지 응용 프로그램에서 두 개의 다른 헤더를 만드는 방법은 무엇입니까?

분류에서Dev

Trace.WriteLine 및 Glimpse를 사용하여 MVC Asp.Net 응용 프로그램 내에서 추적을 비활성화하는 방법은 무엇입니까?

분류에서Dev

"파일"(응용 프로그램 생성 이름 : Microsoft Word)의 결과를 사용하여 특정 문자열을 검색하는 방법은 무엇입니까?

분류에서Dev

"파일"(응용 프로그램 생성 이름 : Microsoft Word)의 결과를 사용하여 특정 문자열을 검색하는 방법은 무엇입니까?

분류에서Dev

내 시스템에서 특정 소리를 생성하는 응용 프로그램을 확인할 수있는 방법은 무엇입니까?

분류에서Dev

응용 프로그램에서 SharedPreferences를 얻는 방법은 무엇입니까?

분류에서Dev

UI5 1.38에서 다른 응용 프로그램의 구성 요소를 재사용하는 방법은 무엇입니까?

분류에서Dev

Windows의 Eclipse RCP 응용 프로그램에서 사용할 때 swt 브라우저 클릭 소리를 비활성화하는 방법은 무엇입니까?

분류에서Dev

동일한 응용 프로그램에서 모든 Windows 메시지를 생성하는 방법은 무엇입니까?

분류에서Dev

Angular 응용 프로그램에서 PDFMake 용 사용자 정의 글꼴을 가져 오는 방법은 무엇입니까?

분류에서Dev

다른 응용 프로그램의 사전 빌드 프로세스에서 cmd 응용 프로그램을 호출하는 방법은 무엇입니까?

분류에서Dev

Java를 사용하여 runnng Windows 응용 프로그램간에 전환하는 방법은 무엇입니까?

분류에서Dev

FTP 서버용 사용자를 생성하는 방법은 무엇입니까?

분류에서Dev

FTP 서버용 사용자를 생성하는 방법은 무엇입니까?

분류에서Dev

프로그램이 이전에 사용되지 않은 번호를 찾을 때까지 새로운 난수를 생성하는 방법은 무엇입니까?

분류에서Dev

Spring Boot REST API에서 생성 된 Angular 클라이언트를 사용하는 방법은 무엇입니까?

분류에서Dev

uWSGI 응용 프로그램 시작 / 중지에 감독자를 사용하는 방법은 무엇입니까?

분류에서Dev

XMonad를 사용하여 시작할 때 특정 작업 공간에서 프로그램을 생성하는 방법은 무엇입니까?

분류에서Dev

Windows 응용 프로그램에서 웹 응용 프로그램으로 데이터를 전달하는 방법은 무엇입니까?

분류에서Dev

메인 프로그램에서 생성자 주입을 사용하는 방법

분류에서Dev

사용자 GUID 내에 키를 생성하는 방법은 무엇입니까?

분류에서Dev

IIS에서 angular2 응용 프로그램을 호스팅하는 방법은 무엇입니까?

분류에서Dev

JHipster를 사용하여 만든 스프링 부트 응용 프로그램에서 npm 설치를 사용하는 동안 오류가 발생했습니다.

Related 관련 기사

  1. 1

    특정 응용 프로그램에서 소리를 비활성화하는 방법은 무엇입니까?

  2. 2

    느린 Office 응용 프로그램 interop 생성자를 디버깅하는 방법은 무엇입니까?

  3. 3

    응용 프로그램에서 QuickBlox 사용자 태그를 삭제하는 방법은 무엇입니까?

  4. 4

    Jhipster 엔티티 하위 생성기 : Gradle을 사용하여 Prod에서 Liquibase DELTA 변경 로그를 만드는 방법은 무엇입니까?

  5. 5

    Angular 2 응용 프로그램에서 npm을 사용하여 툴팁에 qtip2를 설치하는 방법은 무엇입니까?

  6. 6

    타사 응용 프로그램에서 사용하기 위해 일부 Windows 10 전역 단축키 만 비활성화하는 방법은 무엇입니까?

  7. 7

    Angular js를 사용하여 다중 페이지 응용 프로그램에서 두 개의 다른 헤더를 만드는 방법은 무엇입니까?

  8. 8

    Trace.WriteLine 및 Glimpse를 사용하여 MVC Asp.Net 응용 프로그램 내에서 추적을 비활성화하는 방법은 무엇입니까?

  9. 9

    "파일"(응용 프로그램 생성 이름 : Microsoft Word)의 결과를 사용하여 특정 문자열을 검색하는 방법은 무엇입니까?

  10. 10

    "파일"(응용 프로그램 생성 이름 : Microsoft Word)의 결과를 사용하여 특정 문자열을 검색하는 방법은 무엇입니까?

  11. 11

    내 시스템에서 특정 소리를 생성하는 응용 프로그램을 확인할 수있는 방법은 무엇입니까?

  12. 12

    응용 프로그램에서 SharedPreferences를 얻는 방법은 무엇입니까?

  13. 13

    UI5 1.38에서 다른 응용 프로그램의 구성 요소를 재사용하는 방법은 무엇입니까?

  14. 14

    Windows의 Eclipse RCP 응용 프로그램에서 사용할 때 swt 브라우저 클릭 소리를 비활성화하는 방법은 무엇입니까?

  15. 15

    동일한 응용 프로그램에서 모든 Windows 메시지를 생성하는 방법은 무엇입니까?

  16. 16

    Angular 응용 프로그램에서 PDFMake 용 사용자 정의 글꼴을 가져 오는 방법은 무엇입니까?

  17. 17

    다른 응용 프로그램의 사전 빌드 프로세스에서 cmd 응용 프로그램을 호출하는 방법은 무엇입니까?

  18. 18

    Java를 사용하여 runnng Windows 응용 프로그램간에 전환하는 방법은 무엇입니까?

  19. 19

    FTP 서버용 사용자를 생성하는 방법은 무엇입니까?

  20. 20

    FTP 서버용 사용자를 생성하는 방법은 무엇입니까?

  21. 21

    프로그램이 이전에 사용되지 않은 번호를 찾을 때까지 새로운 난수를 생성하는 방법은 무엇입니까?

  22. 22

    Spring Boot REST API에서 생성 된 Angular 클라이언트를 사용하는 방법은 무엇입니까?

  23. 23

    uWSGI 응용 프로그램 시작 / 중지에 감독자를 사용하는 방법은 무엇입니까?

  24. 24

    XMonad를 사용하여 시작할 때 특정 작업 공간에서 프로그램을 생성하는 방법은 무엇입니까?

  25. 25

    Windows 응용 프로그램에서 웹 응용 프로그램으로 데이터를 전달하는 방법은 무엇입니까?

  26. 26

    메인 프로그램에서 생성자 주입을 사용하는 방법

  27. 27

    사용자 GUID 내에 키를 생성하는 방법은 무엇입니까?

  28. 28

    IIS에서 angular2 응용 프로그램을 호스팅하는 방법은 무엇입니까?

  29. 29

    JHipster를 사용하여 만든 스프링 부트 응용 프로그램에서 npm 설치를 사용하는 동안 오류가 발생했습니다.

뜨겁다태그

보관