Unduhan Hippy - Unduhan kode sumber Hippy

Hippy

Kode sumber lainnya

2024-11-08, Version 3.3.2 (LTS)

Unduh

Kerangka Kerja Lintas Platform Hippy

Status Tindakan

Beranda

Perkenalan

Hippy adalah kerangka pengembangan lintas platform, yang bertujuan untuk membantu pengembang menulis sekali, dan berjalan di berbagai platform (iOS, Android, Web, dan sebagainya). Hippy cukup bersahabat dengan pengembang Web, terutama mereka yang familiar dengan React atau Vue. Dengan Hippy, pengembang dapat membuat aplikasi lintas platform dengan mudah.

Hippy kini diterapkan di aplikasi utama Tencent seperti Mobile QQ, Mobile QQ Browser, Tencent Video App, QQ Music App, dan Tencent News, menjangkau ratusan juta pengguna biasa.

? Keuntungan

Dirancang untuk pengembang Web, secara resmi mendukung kerangka Web seperti React dan Vue .
API yang sama untuk platform berbeda.
Performa luar biasa dengan komunikasi pengikatan mesin JS.
Komponen bawaan yang dapat didaur ulang dengan kinerja lebih baik.
Bermigrasi dengan lancar dan lancar ke browser Web.
Mesin Flex Layout yang didukung penuh.

? Memulai

Mempersiapkan lingkungan

Pastikan Anda telah menginstal git dan npm secara lokal.

Jalankan git clone https://github.com/Tencent/Hippy.git dan npm install di direktori root proyek.

Repositori Hippy menerapkan git-lfs untuk mengelola file so,gz,otf, pastikan Anda telah menginstal git-lfs terlebih dahulu.

Untuk pengembang macOS:

Xcode dengan iOS SDK: buat aplikasi iOS.
Android Studio dengan NDK: membangun aplikasi android.
Node.JS: jalankan skrip build.

homebrew disarankan untuk menginstal dependensi.

Untuk pengembang Windows:

Android Studio dengan NDK: membangun aplikasi android.
Node.JS: jalankan skrip build.

Windows tidak dapat menjalankan lingkungan pengembangan iOS sejauh ini.

Bangun simulator iOS dengan demo js

Untuk iOS, kami menyarankan untuk menggunakan simulator iOS saat pertama kali mencoba. Namun, Anda dapat mengubah konfigurasi Xcode untuk menginstal aplikasi ke iPhone jika Anda ahli iOS.

cd ke driver/js/ .
Jalankan npm run init .
Perintah ini digabungkan dengan npm install && npx lerna bootstrap && npm run build .
npm install : Instal dependensi skrip pembangunan proyek.
npx lerna bootstrap : Instal dependensi setiap paket npm.（Hippy menggunakan Lerna untuk mengelola paket multi js, jika perintah lerna tidak ditemukan, jalankan npm install lerna -g terlebih dahulu.）
npm run build : Bangun setiap paket SDK front-end.
Pilih demo yang akan dibuat dengan npm run buildexample [hippy-react-demo|hippy-vue-demo|hippy-vue-next-demo] .
Instal CocoaPods dengan brew install cocoapods , instal cmake dengan brew install cmake , lalu jalankan perintah pod install di direktori framework/examples/ios-demo , yang akan membuat file HippyDemo.xcworkspace dan menginstal dependensi Cocoapods.
Mulai Xcode dan buat aplikasi iOS dengan membuka framework/examples/ios-demo/HippyDemo.xcworkspace .

Jika Step 2 terjadi kesalahan, Anda dapat melakukan cd ke driver/js/examples hippy-react-demo atau hippy-vue-demo, dan menjalankan npm install untuk menginstal dependensi demo terlebih dahulu.
Detail lebih lanjut untuk integrasi iOS SDK.

Bangun aplikasi Android dengan demo js

Untuk Android, kami sarankan menggunakan ponsel asli untuk mengembangkan pengalaman yang lebih baik, karena Hippy menggunakan mesin X5 JS yang tidak dapat mendukung simulator x86, serta simulator ARM memiliki kinerja yang rendah.

Sebelum membangun aplikasi Android, pastikan SDK dan NDK sudah diinstal, dan JANGAN perbarui rantai alat build.

cd ke driver/js/ .
Jalankan npm run init .
Perintah ini digabungkan dengan npm install && npx lerna bootstrap && npm run build .
npm install : Instal dependensi skrip pembangunan proyek.
npx lerna bootstrap : Instal dependensi setiap paket npm.（Hippy menggunakan Lerna untuk mengelola paket multi js, jika perintah lerna tidak ditemukan, jalankan npm install lerna -g terlebih dahulu.）
npm run build : Bangun setiap paket SDK front-end.
Pilih demo yang akan dibuat dengan npm run buildexample [hippy-react-demo|hippy-vue-demo|hippy-vue-next-demo] .
Buka Hippy Project di direktori root dengan Android Studio.
Hubungkan ponsel Android dengan kabel USB dan pastikan mode debugging USB diaktifkan (Jalankan adb devices di terminal komputer untuk memeriksa status koneksi ponsel).
Buka proyek dengan Android Studio, jalankan dan instal apk.

Jika Step 2 terjadi kesalahan, Anda dapat cd ke driver/js/examples hippy-react-demo, hippy-vue-demo atau hippy-vue-next-demo, dan menjalankan npm install untuk menginstal dependensi demo terlebih dahulu.
Jika Anda mengalami masalah No toolchains found in the NDK toolchains folder for ABI with prefix: mips64el-linux-android , inilah solusinya.
Detail lebih lanjut untuk integrasi Android SDK.

Debug demo js

Ikuti Membangun simulator iOS dengan demo js atau Membangun aplikasi Android dengan demo js terlebih dahulu untuk membangun Aplikasi.
cd ke driver/js/ .
Jalankan npm run init:example [hippy-react-demo|hippy-vue-demo|hippy-vue-next-demo] .
Jalankan npm run debugexample [hippy-react-demo|hippy-vue-demo|hippy-vue-next-demo] dev .

Atau Anda dapat melakukan cd ke direktori driver/js/examples/hippy-react-demo , driver/js/examples/hippy-vue-demo atau driver/js/examples/hippy-vue-next-demo untuk menjalankan npm run hippy:debug dan npm run hippy:dev sebagai gantinya.
Pada contoh mode debug, paket npm seperti @hippy/react, @hippy/vue, @hippy/vue-next ditautkan ke driver/js/packages > [different package] > dist (bukan node_modules), jadi jika sudah berubah kode sumber paket js dan ingin menerapkannya pada contoh target, hubungi npm run build lagi.
Detail lebih lanjut untuk debugging dapat dibaca di Dokumen Debug Hippy.

Bangun demo produksi js

Ikuti Membangun simulator iOS dengan demo js atau Membangun aplikasi Android dengan demo js terlebih dahulu untuk membangun Aplikasi.
cd ke driver/js/examples/hippy-react-demo , driver/js/examples/hippy-vue-demo atau driver/js/examples/hippy-vue-next-demo .
Jalankan npm install untuk menginstal dependensi demo js.
Jalankan npm run hippy:vendor dan npm run hippy:build secara berurutan untuk membangun vendor.[android|ios].js dan index.[android|ios].js .

Demo Hippy menggunakan DllPlugin untuk membagi potongan umum dan potongan aplikasi.

? Dokumentasi

Untuk melihat contoh hippy dan kunjungi hippyjs.org.

? log perubahan

Perubahan mendetail untuk setiap versi rilis didokumentasikan dalam catatan rilis proyek.

? Struktur proyek

 Hippy
├── devtools                                                      # Devtools for Hippy.
├── dom                                                           # DOM Layer for Hippy.
├── driver                                                        # Different UI Driver Layers for Hippy.
│   └── js                                                     # JS Driver Layer for Hippy.
│       ├── examples                                                # Related examples for JS Driver.
│       ├── include
│       ├── packages                                                # Related JS Packages for JS Driver.
│       │   ├── hippy-react
│       │   ├── hippy-react-web
│       │   ├── hippy-vue
│       │   ├── hippy-vue-css-loader
│       │   ├── hippy-vue-loader
│       │   ├── hippy-vue-native-components
│       │   └── hippy-vue-router
│       └── src
├── framework
│   ├── android
│   ├── examples
│   │   ├── android-demo
│   │   └── ios-demo
│   └── ios
├── layout                                                      # Layout engine for Hippy.
├── modules
│   ├── android
│   └── footstone
├── renderer                                                    # Different Renderers for Hippy.
│   ├── flutter
│   └── native
│       ├── android
│       └── ios
└── static

? Kontribusi

Pengembang dipersilakan untuk berkontribusi pada sumber terbuka Tencent, dan kami juga akan memberi mereka insentif untuk mengakui dan berterima kasih kepada mereka. Berikut kami berikan penjelasan resmi mengenai kontribusi open source Tencent. Aturan kontribusi khusus untuk setiap proyek dirumuskan oleh tim proyek. Pengembang dapat memilih proyek yang sesuai dan berpartisipasi sesuai dengan aturan terkait. Komite Manajemen Proyek Tencent akan melapor secara berkala kepada kontributor yang memenuhi syarat dan penghargaan akan diberikan melalui kontak resmi. Sebelum membuat permintaan tarik atau masalah ke Hippy, pastikan untuk membaca Panduan Berkontribusi.

Semua orang yang telah berkontribusi pada Hippy dapat dilihat di File Kontributor dan Penulis.