Cara Memasang Ionik di Fedora 38/37/36

Cara Memasang Ionik di Fedora 38/37/36

Ionic adalah rangka kerja sumber terbuka yang popular untuk membina aplikasi mudah alih silang platform menggunakan teknologi web seperti HTML, CSS, dan JavaScript. Ia memanfaatkan sudut, bertindak balas, atau vue.JS untuk mewujudkan antara muka pengguna yang berkualiti tinggi dan asli. Fedora adalah pengedaran Linux yang didorong oleh komuniti yang berfungsi sebagai asas bagi Red Hat Enterprise Linux (RHEL) komersial. Dalam artikel ini, kami akan membimbing anda melalui proses memasang ionik di fedora, bersama -sama dengan membuat aplikasi sampel yang mudah.

Prasyarat

Sebelum anda boleh memasang Ionic di Fedora, pastikan anda mempunyai prasyarat berikut:

  • Sistem yang menjalankan Fedora (versi 33 atau lebih tinggi disyorkan).
  • Akaun pengguna dengan keistimewaan sudo.

Langkah 1: Kemas kini sistem

Pertama, kemas kini sistem Fedora anda dengan menjalankan arahan berikut:

Sudo DNF Update -y  

Perintah ini akan memastikan bahawa sistem anda mempunyai kemas kini terkini dan patch keselamatan.

Langkah 2: Pasang nod.js

Ionik memerlukan nod.JS, runtime JavaScript, untuk dijalankan. Pasang nod.JS menggunakan arahan berikut:

curl -sl https: // rpm.Nodesource.com/setup_18.X | sudo -e bash -  SUDO DNF Pasang NodeJS  

Setelah pemasangan selesai, anda boleh mengesahkan nod.Versi JS dengan menjalankan:

nod -v  

Langkah 3: Pasang ionik CLI

Ionic CLI (antara muka baris arahan) adalah alat yang membantu anda membuat, membangun, dan menguruskan aplikasi ionik. Pasang CLI ionik secara global pada sistem anda menggunakan NPM:

SUDO NPM Pasang -G @Ionic/CLI  

Setelah pemasangan selesai, sahkan versi CLI Ionic dengan menjalankan:

Ionic -v  

Langkah 4: Buat projek ionik baru

Sekarang anda telah memasang ion, anda boleh membuat projek ionik baru. Untuk melakukan ini, jalankan arahan berikut:

Ionic Start Mysampleapp kosong -Type = Sudut  

Menggantikan 'mysampleapp' dengan nama yang dikehendaki untuk permohonan anda. Perintah ini akan membuat direktori baru dengan nama yang ditentukan dan menubuhkan projek ionik dengan templat kosong menggunakan sudut.

Langkah 5: Navigasi ke Direktori Projek

Navigasi ke Direktori Projek yang baru diwujudkan:

CD MySampleApp  

Langkah 6: Jalankan aplikasi ionik

Untuk menjalankan aplikasi ionik di pelayar web anda, gunakan arahan berikut:

berkhidmat ionik  

Perintah ini akan membuka pelayar web lalai anda dan memaparkan aplikasi ionik anda.

Langkah 7: Buat aplikasi contoh

Untuk membuat aplikasi sampel yang mudah, buka "SRC/App/Home/Home.halaman.html ” Fail dalam editor teks kegemaran anda dan ganti kandungannya dengan yang berikut:

Aplikasi contoh saya aplikasi sampel saya klik saya!
12345678910111213141516171819 Aplikasi sampel saya Aplikasi sampel saya Klik saya!

Seterusnya, buka "SRC/App/Home/Home.halaman.ts ” Fail dalam editor teks anda dan gantang kandungannya dengan yang berikut:

import component dari '@angular/core'; import alertController dari '@ionic/angular'; @Component (Selector: 'App-Home', TemplateUrl: 'Laman Utama.halaman.html ', styleurls: [' rumah.halaman.SCSS '],) Laman Utama Kelas Eksport Constructor (Public AlertController: AlertController) async showalert () const alert = menunggu ini.AlertController.buat (header: 'hello!', Mesej:' Ini adalah aplikasi ionik sampel.', butang: [' ok ']); Awak amaran.hadir ();
12345678910111213141516171819202122import component dari '@angular/core'; import alertController dari '@ionic/angular'; @Component (Selector: 'App-Home', TemplateUrl: 'Laman Utama.halaman.html ', styleurls: [' rumah.halaman.SCSS '],) Laman Utama Kelas Eksport Constructor (Public AlertController: AlertController) async showalert () const alert = menunggu ini.AlertController.buat (header: 'hello!', Mesej:' Ini adalah aplikasi ionik sampel.', butang: [' ok ']); Awak amaran.hadir ();

Dalam aplikasi sampel ini, kami telah menambah butang ionik yang, apabila diklik, memaparkan amaran mudah dengan mesej.

Langkah 8: Uji permohonan sampel

Sekarang anda telah membuat aplikasi sampel, jalankan sekali lagi di pelayar web anda dengan melaksanakan arahan berikut dari direktori projek:

berkhidmat ionik  

Penyemak imbas web anda harus membuka dan memaparkan aplikasi ionik yang dikemas kini. Klik "Klik saya!" butang untuk melihat amaran dengan mesej.

Kesimpulan

Dalam artikel ini, kami telah menunjukkan cara memasang Ionic di Fedora dan membuat aplikasi sampel yang mudah. Anda kini bersedia untuk mula membangunkan aplikasi mudah alih silang platform menggunakan rangka kerja ionik. Dengan asas ini, anda boleh membuat antara muka pengguna yang berkualiti tinggi dan asli untuk aplikasi mudah alih anda di Fedora.