H5-Editor
Operasi visual, seret dan lepas untuk menghasilkan halaman, mengekspor file html
Ia memiliki sistem plugin editor untuk pengembang, mendukung pewarisan dari proyek yang ada, dan mendukung pengembangan sekunder.
H5-Editor adalah proyek front-end murni, dikembangkan berdasarkan Vue2, dan menghasilkan halaman melalui drag and drop, mirip dengan Yiqixiu, Baidu H5, dll.
Demo
Klik di sini untuk mengakses demo online
Penggunaan
git clone https://github.com/a7650/h5-editor.git
cd h5-editor
#如果你已经安装了nodejs，vue-cli等环境，可直接执行下列命令，否则需先安装环境
npm install
npm run dev
tumpukan teknologi
Terutama berdasarkan Vue2, Element-ui (digunakan dalam jumlah kecil), Vuex
Fungsi utama editor
- Elemen dapat diseret, diperbesar, diperkecil, dan diputar secara bebas
- Gambar, teks, persegi panjang, dan latar belakang dapat ditambahkan. Berbagai fitur pengeditan (font, latar belakang, ukuran, margin, dll.)
- Adsorpsi otomatis komponen dan panduan waktu nyata (komponen dapat secara otomatis diserap dan disejajarkan dengan kanvas, panduan khusus, dan komponen lainnya, serta menampilkan panduan waktu nyata. Tekan tombol alt sambil menyeret untuk menutup sementara)
- Penggaris, garis referensi, garis referensi yang dapat disesuaikan (klik pada penggaris untuk menghasilkan garis referensi, seret garis referensi untuk mengubah posisinya, klik dua kali untuk menghapus garis referensi)
- Undo, redo (mendukung tombol pintas, jumlah langkah undo yang dapat dikonfigurasi)
- Salin, tempel, kunci, sembunyikan komponen, dll.
- ctrl + drag komponen untuk menyalin komponen dengan cepat
- Menu klik kanan, menu dapat dikonfigurasi dan dapat dibuat secara fleksibel sesuai dengan status komponen saat ini (yaitu, komponen yang berbeda dapat menghasilkan menu yang berbeda)
- Panel lapisan memungkinkan Anda menarik dan melepas lapisan komponen, mengganti namanya, dan dengan cepat mengunci, menghapus, dan menyembunyikan komponen di panel lapisan.
- Pilih beberapa komponen sekaligus (tekan ctrl + klik kiri) untuk menyelaraskan beberapa komponen
- Cadangan data disimpan secara lokal melalui database indexDB (tersedia cadangan otomatis dan manual), dan data dapat dipulihkan dari cadangan.
- Hasilkan kode h5 dengan satu klik
- Edit ukuran kanvas
- Berbagai tombol pintas
- Pusat pengaturan, Anda dapat mengatur fungsi pembatalan, fungsi pencadangan, dll.
- Ada sistem plug-in untuk pengembang, yang dapat digunakan untuk pengembangan sekunder. Silakan merujuk ke pluginA di direktori plugins.
