React Academy · Pelajaran

Pembungkusan dan Pengedaran untuk Platform Desktop

Bina pemasang untuk macOS, Windows dan Linux menggunakan electron-builder dengan penandatanganan kod serta kemas kini automatik.

Pelajaran 4 daripada 413 langkah

Pembungkusan dan Pengedaran untuk Platform Desktop ialah pelajaran React Academy percuma di CoddyKit. Ini ialah pelajaran 4 daripada 4. Anda boleh membaca keseluruhan pelajaran di bawah secara percuma — kemudian berlatih secara praktikal dalam pelayar menggunakan penyunting kod terbina dalam dan tutor kecerdasan buatan 24/7. Pelajaran ini merupakan sebahagian daripada laluan pembelajaran React Academy, dan kemajuan anda disegerakkan merentas web serta aplikasi CoddyKit. Kursus React Academy merangkumi sejumlah 4 pelajaran.

Konfigurasi electron-builder

electron-builder ialah alat piawai untuk memaketkan aplikasi Electron menjadi pemasang yang boleh diedarkan. Konfigurasinya berada dalam package.json di bawah kunci "build", yang menentukan metadata aplikasi (appId, productName), laluan ikon dan format sasaran bagi setiap platform.

Sasaran Binaan Mengikut Platform

electron-builder menyokong macOS (dmg dan zip), Windows (pemasang nsis) dan Linux (AppImage serta deb). Anda boleh menyasarkan berbilang platform dalam satu arahan binaan atau mengkonfigurasi CI untuk membina setiap platform pada pelaksana aslinya bagi mendapatkan keserasian terbaik.

Penandatanganan Kod untuk macOS

macOS memerlukan penandatanganan kod menggunakan sijil Apple Developer supaya Gatekeeper membenarkan pengguna membuka aplikasi tanpa amaran keselamatan. electron-builder membaca sijil anda daripada Rantai Kunci macOS semasa proses binaan dan menandatangani semua binari secara automatik.

Notarisasi untuk macOS

Selain penandatanganan kod, macOS moden juga memerlukan notarisasi — anda perlu menghantar aplikasi kepada perkhidmatan notarisasi Apple, yang mengimbas perisian hasad dan mengeluarkan tiket. electron-builder boleh mengautomatikkan notarisasi melalui electron-notarize, dan pengguna macOS 10.15 ke atas akan disekat tanpanya.

Penandatanganan Kod untuk Windows

Windows memerlukan sijil Authenticode daripada Pihak Berkuasa Sijil (CA) yang dipercayai supaya SmartScreen mempercayai pemasang anda. Tanpa penandatanganan, pengguna akan melihat amaran "Windows protected your PC". Sijil Pengesahan Lanjutan (EV) menghapuskan amaran itu serta-merta, manakala sijil OV piawai membina kepercayaan dari semasa ke semasa.

Struktur Output Binaan

Selepas binaan berjaya, electron-builder menulis pemasang khusus platform ke direktori dist/. Anda akan menemui DMG atau zip untuk macOS, fail boleh laku NSIS .exe untuk Windows dan AppImage atau .deb untuk Linux, bersama-sama manifes kemas kini automatik latest.yml (atau latest-mac.yml).

Ikon Aplikasi

Aplikasi Electron memerlukan ikon dalam format khusus platform: PNG 512x512 untuk Linux, fail ICNS (pelbagai resolusi) untuk macOS dan fail ICO (pelbagai resolusi) untuk Windows. electron-builder boleh menjana semua format daripada satu PNG 1024x1024 menggunakan bendera --icon.

Kemas Kini Automatik dengan electron-updater

Pakej electron-updater disepadukan dengan electron-builder untuk menyediakan kemas kini automatik. Terbitkan binaan anda ke GitHub Releases atau S3, dan electron-updater boleh menyemak kemas kini semasa permulaan, memuat turun kemas kini delta di latar belakang dan meminta pengguna memulakan semula aplikasi.

Menyemak Kemas Kini Semasa Permulaan

Panggil autoUpdater.checkForUpdatesAndNotify() dalam main.js selepas aplikasi sedia. electron-updater mengambil manifes latest.yml daripada sasaran penerbitan anda, membandingkan versi dan, jika kemas kini tersedia, memuat turunnya serta memaparkan pemberitahuan asli apabila kemas kini itu sedia dipasang.

Arkib ASAR

electron-builder memaketkan fail JavaScript aplikasi anda ke dalam satu arkib ASAR (serupa dengan fail tar) untuk pengedaran. Ini meningkatkan prestasi permulaan dengan mengurangkan carian sistem fail dan menyukarkan pemeriksaan terus terhadap kod sumber anda, walaupun tidak menjadikannya mustahil.

Menyahpak Modul Asli daripada ASAR

Modul Node.js asli (fail .node) tidak boleh dimuatkan dari dalam arkib ASAR — modul tersebut mesti dinyahpak ke sistem fail. Konfigurasikan asarUnpack dalam electron-builder untuk menyenaraikan corak modul asli, yang akan meletakkannya dalam direktori app.asar.unpacked bersebelahan dengan arkib.

Keperluan Notarisasi macOS

Mengapakah notarisasi diperlukan untuk pengedaran macOS selain penandatanganan kod sahaja?

Imbas Kembali Pelajaran

Mengedarkan aplikasi Electron melibatkan konfigurasi sasaran electron-builder, menandatangani kod untuk macOS (dengan notarisasi) dan Windows (Authenticode), serta menyediakan kemas kini automatik dengan electron-updater jika diperlukan. Arkib ASAR memaketkan aplikasi anda untuk pengedaran, manakala modul asli dinyahpak secara berasingan. Alur CI/CD yang kukuh mengendalikan langkah-langkah ini secara automatik bagi setiap platform.

Percuma untuk bermula

Pelajari React dengan tutor kecerdasan buatan — percuma

Tulis dan jalankan kod sebenar dalam pelayar anda, dapatkan bantuan segera daripada tutor kecerdasan buatan yang tersedia 24/7, dan sambung semula dari tempat anda berhenti di web atau dalam aplikasi.

Kursus
88
Pelajaran
324

Soalan Lazim

Adakah pelajaran “Pembungkusan dan Pengedaran untuk Platform Desktop” percuma?

Ya — teks penuh “Pembungkusan dan Pengedaran untuk Platform Desktop” boleh dibaca secara percuma di web ini. Untuk berlatih secara interaktif menggunakan penyunting kod terbina dalam dan tutor kecerdasan buatan 24/7, serta membuka kunci baki kursus React Academy, tingkat taraf kepada CoddyKit PRO. Kursus React Academy merangkumi sejumlah 4 pelajaran.

Apakah yang akan saya pelajari dalam “Pembungkusan dan Pengedaran untuk Platform Desktop”?

Bina pemasang untuk macOS, Windows dan Linux menggunakan electron-builder dengan penandatanganan kod serta kemas kini automatik. Anda berlatih React Academy menggunakan kod praktikal yang dijalankan terus dalam pelayar, manakala tutor kecerdasan buatan 24/7 menjawab soalan anda semasa anda mengikuti pelajaran.

Adakah saya memerlukan pengalaman untuk memulakan React Academy?

Tiada pengalaman terdahulu diperlukan. Pembelajaran React Academy di CoddyKit disusun untuk pelajar daripada peringkat pemula hingga lanjutan, jadi anda boleh bermula di sini atau dari awal dan belajar mengikut kadar anda sendiri. Ini ialah pelajaran 4 daripada 4.

Berapa lamakah pelajaran “Pembungkusan dan Pengedaran untuk Platform Desktop” diambil?

Kebanyakan pelajaran CoddyKit mengambil masa kira-kira 5–10 minit. Setiap pelajaran ringkas dan interaktif, jadi anda boleh membuat kemajuan secara berterusan dan menyambung tepat dari tempat anda berhenti di web atau aplikasi.

Bolehkah saya menulis dan menjalankan kod dalam pelajaran React Academy ini?

Ya. Setiap pelajaran React Academy menyertakan penyunting kod terbina dalam, jadi anda boleh menulis dan menjalankan kod sebenar terus dalam pelayar serta menerima maklum balas kecerdasan buatan serta-merta — tanpa memerlukan persediaan setempat.

Semua pelajaran dalam kursus ini

  1. Seni Bina Electron: Proses Utama dan Pemapar
  2. Menyediakan React dengan Electron
  3. Komunikasi IPC antara Proses
  4. Pembungkusan dan Pengedaran untuk Platform Desktop
← Kembali ke React Academy