배포용 전자 앱 패키징

이 가이드에서는 Windows API를 사용하여 Electron 앱을 배포하기 위한 MSIX 패키지를 만드는 방법을 보여 줍니다.

필수 조건

패키징하기 전에 다음을 수행했는지 확인합니다.

개발 환경 설정 완료
[선택 사항] 추가 기능(예: Phi Silica 추가 기능 또는 WinML 추가 기능)을 만들고 테스트했습니다.
를 사용하여 앱이 올바르게 실행되는지 확인했습니다. npm start

패키징 준비

최종 빌드에서 임시 파일을 제외하도록 Electron Forge를 구성합니다. forge.config.js의 packagerConfig에 ignore 배열을 추가합니다.

module.exports = {
  packagerConfig: {
    asar: true,
    ignore: [
      /^\/\.winapp($|\/)/,     // SDK packages and headers
      /^\/winapp\.yaml$/,       // SDK config
      /\.pfx$/,                 // Certificate files
      /\.pdb$/,                 // Debug symbols
      /\/obj($|\/)/,            // C# build artifacts
      /\/bin($|\/)/,            // C# build artifacts
      /\.msix$/                 // MSIX packages
    ]
  },
  // ... rest of your config
};

Important

Package.appxmanifest 패키지된 앱 구조와 일치하는지 확인합니다.

Executable 속성은 패키지된 출력에서 올바른 .exe 파일을 지정해야 합니다.

개발 인증서 생성

서명된 MSIX 패키지를 만들기 전에 개발 인증서를 생성합니다.

npx winapp cert generate

그러면 프로젝트 루트에 MSIX 패키지에 서명하는 데 사용할 파일이 만들어집니다 devcert.pfx .

패키징 옵션

Electron 앱용 MSIX 패키지를 만드는 두 가지 옵션이 있습니다.

옵션 1: winapp CLI 직접 사용 - 구성 가능, 모든 패키지에서 작동
옵션 2: Electron Forge MSIX Maker 사용 - Forge 워크플로에 더 통합

워크플로에 가장 적합한 옵션을 선택합니다.

옵션 1: winapp CLI를 직접 사용(유연성에 권장)

이 방법을 사용하면 패키징 프로세스를 더 잘 제어할 수 있으며 모든 Electron 패키저에서 작동합니다.

당신의 Electron 앱 빌드

MSIX를 사용하여 Electron 앱을 패키지하려면 먼저 프로덕션 레이아웃을 만들어야 합니다. Electron Forge를 사용하면 패키지 명령을 사용할 수 있습니다.

# Package with Electron Forge (or your preferred packager)
npx electron-forge package

그러면 폴더에 앱의 프로덕션 버전이 ./out/ 생성됩니다. 정확한 폴더 이름은 앱 이름 및 아키텍처(예: my-windows-app-win32-x64)에 따라 달라집니다.

MSIX 패키지 만들기

이제 winapp CLI를 사용하여 패키지된 앱에서 MSIX 패키지를 만들고 서명합니다.

npx winapp pack .\out\<your-app-folder> --output .\out --cert .\devcert.pfx --manifest .\Package.appxmanifest

Electron Forge에서 생성한 실제 폴더 이름(my-windows-app-win32-x64 x64 또는 my-windows-app-win32-arm64 ARM64 등)으로 <your-app-folder>을(를) 대체합니다.

옵션으로 --manifest 선택할 수 있습니다. 제공되지 않으면 패키지되는 폴더 또는 현재 디렉터리에서 Package.appxmanifest를 찾습니다.

옵션 --cert 도 선택 사항입니다. 제공되지 않으면 msix에 서명되지 않습니다.

옵션 --output 도 선택 사항입니다. 제공되지 않으면 현재 디렉터리가 사용됩니다.

MSIX 패키지가 ./out/<your-app-name>.msix로 생성됩니다.

팁 (조언)

편의를 위해 스크립트에 package.json 다음 명령을 추가할 수 있습니다.

{
  "scripts": {
    "package-msix": "npm run build-csAddon && npx electron-forge package && npx winapp pack ./out/my-windows-app-win32-x64 --output ./out --cert ./devcert.pfx --manifest Package.appxmanifest"
  }
}

실제 출력 폴더 이름과 일치하도록 경로를 업데이트하기만 하면 됩니다.

옵션 2: Electron Forge MSIX Maker 사용(Forge 사용자용)

이미 Electron Forge를 사용하는 경우 @electron-forge/maker-msix Maker를 사용하여 MSIX 패키징을 Forge 워크플로에 직접 통합할 수 있습니다.

MSIX Maker 설치

npm install --save-dev @electron-forge/maker-msix

forge.config.js를 구성합니다

MSIX Maker를 forge.config.js에 추가하세요.

module.exports = {
  // ... other config
  makers: [
    {
      name: '@electron-forge/maker-msix',
      config: {
        appManifest: '.\\Package.appxmanifest',
        windowsSignOptions: {
          certificateFile: '.\\devcert.pfx',
          certificatePassword: 'password'
        }
      }
    }
  ],
  // ... rest of your config
};

appxmanifest 패키지 업데이트

Electron Forge MSIX 제조업체는 winapp CLI 접근 방식과 다른 폴더 레이아웃을 사용합니다. MSIX의 폴더 내에 app\ 앱을 배치합니다. 이 폴더는 패키징하는 동안 자동으로 만들어지며 직접 만들 필요가 없습니다. Package.appxmanifest 안에서 Executable 경로를 app 폴더를 가리키도록 업데이트합니다.

<Applications>
  <Application Id="myApp"
    Executable="app\my-app.exe"
    EntryPoint="Windows.FullTrustApplication">
    <!-- ... rest of your application config -->
  </Application>
</Applications>

실제 실행 파일 이름으로 대체 my-app.exe 합니다. ** 이는 package.json의 productName (또는 name) 필드를 기반으로 합니다.

메모

Forge MSIX 메이커는 Package.appxmanifest의 MinVersion를 기반으로 Windows SDK 도구를 검색합니다. WindowsKit을 찾을 수 없다는 오류가 발생하면 지정된 MinVersion SDK 버전이 컴퓨터에 설치되어 있는지 확인하거나 설치된 SDK 버전과 일치하도록 업데이트 MinVersion 합니다.

MSIX 패키지 만들기

이제 MSIX 패키지를 만들 수 있습니다. 플래그를 --targets 사용하여 MSIX 제조업체만 실행합니다(그렇지 않으면 Forge는 구성된 모든 제조업체를 실행합니다.)

npx electron-forge make --targets @electron-forge/maker-msix

MSIX 패키지는 ./out/make/msix/<arch>/ 폴더(예: ./out/make/msix/arm64/ 또는 ./out/make/msix/x64/)에 생성됩니다.

팁 (조언)

이 방법은 Electron Forge 워크플로와 더 통합되며 한 단계에서 패키징 및 MSIX 생성을 자동으로 처리합니다.

MSIX 설치 및 테스트

먼저 개발 인증서(일회성 설정)를 설치합니다.

# Run as Administrator:
npx winapp cert install .\devcert.pfx

이제 MSIX 패키지를 설치합니다. msix 파일을 두 번 클릭하거나 다음 명령을 실행합니다.

# Option 1 output:
Add-AppxPackage .\out\<your-app-name>.msix

# Option 2 output:
Add-AppxPackage .\out\make\msix\<arch>\<your-app-name>.msix

빌드 출력의 실제 값으로 <your-app-name> 및 <arch>를 대체하십시오.

앱이 시작 메뉴에 표시됩니다. 이 기능을 시작하고 Windows API 기능을 테스트합니다.

배포 옵션

작동하는 MSIX 패키지가 있으면 앱을 배포하기 위한 몇 가지 옵션이 있습니다.

직접 다운로드

직접 다운로드를 위해 웹 사이트에서 MSIX 패키지를 호스트합니다. 사용자가 보안 경고 없이 설치할 수 있도록 신뢰할 수 있는 CA(인증 기관)의 코드 서명 인증서로 서명해야 합니다.

Microsoft Store

가장 광범위한 배포 및 자동 업데이트를 위해 Microsoft Store 앱을 제출합니다. 다음을 수행해야 합니다.

Microsoft Partner Center 계정 만들기
앱 이름 예약
스토어 ID로 Package.appxmanifest를 업데이트합니다. msix에 서명할 필요가 없으므로 스토어 게시 프로세스에서 자동으로 서명합니다.
인증을 위해 제출

자세한 정보: 앱을 Microsoft Store

기업 배포

다음을 통해 엔터프라이즈 고객에게 직접 전달합니다.

회사 포털 - Intune을 사용하는 조직의 경우
직접 다운로드 - 웹 사이트에서 MSIX 호스트
사이드 로딩 - PowerShell 또는 앱 설치 관리자를 통해 설치

자세한 정보: 스토어 외부에 앱 배포

앱 설치 관리자

.appinstaller 자동 업데이트에 대한 파일을 만듭니다.

<?xml version="1.0" encoding="utf-8"?>
<AppInstaller
    Uri="https://your-domain.com/packages/myapp.appinstaller"
    Version="1.0.0.0"
    xmlns="http://schemas.microsoft.com/appx/appinstaller/2017/2">
    <MainPackage
        Name="YourAppName"
        Version="1.0.0.0"
        Publisher="CN=YourPublisher"
        Uri="https://your-domain.com/packages/myapp.msix"
        ProcessorArchitecture="x64" />
    <UpdateSettings>
        <OnLaunch HoursBetweenUpdateChecks="24" />
    </UpdateSettings>
</AppInstaller>

자세한 정보: 앱 설치 관리자 파일 개요

다음 단계

축하합니다! 배포를 위해 Windows 사용 가능한 Electron 앱을 성공적으로 패키지했습니다. 🎉

추가 리소스

winapp CLI 설명서 - 전체 CLI 참조
샘플 Electron 앱 - 완전한 동작 예제
MSIX 패키징 설명서 - MSIX에 대한 자세한 정보
Windows 앱 인증 키트 - 스토어 제출 전에 앱 테스트

개요로 돌아가기

시작 개요 - 기본 가이드로 돌아가기
개발 환경 설정 - 설정 단계 검토
Phi Silica Addon 만들기 - 추가 기능 만들기 검토
WinML 추가 기능 만들기 - WinML 통합에 대해 알아보기

지원 받기

버그를 찾았나요?문제 제출

배포를 성공적으로 하세요! 🚀

피드백

이 페이지가 도움이 되었나요?

Last updated on 2026-05-12