Sediakan Aplikasi Web Nuxt.js di Ubuntu 18.04 LTS

• Nuxt.js: Rangka Kerja Universal
• Memasang Node.js
• Permohonan Perancah
• Permulaan awal
• Bangunan Untuk Pengeluaran
• PM2: Urus aplikasi anda dengan senang

Nuxt.js: Rangka Kerja Universal

Nuxt.js adalah kerangka JavaScript yang direka untuk membuat aplikasi Vue.js universal dengan cepat. Ia paling terkenal kerana keupayaannya membuat aplikasi Vue.js yang boleh diberikan pada pelayan dan juga klien. Dalam tutorial ini, kami akan menyiapkan aplikasi Nuxt.js yang diberikan pelayan dan menyebarkannya di Ubuntu 18.04 LTS.

Memasang Node.js

Pertama, anda perlu memastikan bahawa anda menjalankan Ubuntu 18.04 LTS. Kemudian, anda perlu memasang Node.js, jika ia belum dipasang. Dalam tutorial ini, kita akan menggunakan Node Version Manager, atau NVM, untuk menjadikan proses ini lebih mudah.

Pasang NVM menggunakan arahan berikut.

curl -sL https://raw.githubusercontent.com/creationix/nvm/v0.33.11/install.sh -o install_nvm.sh
bash install_nvm.sh
source ~/.profile
nvm install 11.1.0
nvm use 11.1.0

Aplikasi Scaffold

Setelah anda memasang Node.js, kami sekarang dapat meneruskan penyediaan paket yang kami perlukan menggunakan NPM. Kami akan menggunakan alat kecil yang berguna yang dipanggil create-nuxt-app, alat buatan masyarakat yang dengan mudah boleh membuat aplikasi Nuxt.js.

Dalam direktori rumah anda, jalankan arahan berikut untuk memulakan penjanaan aplikasi.

npx create-nuxt-app <nameofproject>

Konsol akan meminta anda untuk beberapa pilihan penting. Demi tutorial ini, kami akan namakan projek kami " app". Kami akan menggunakan Express sebagai kerangka pelayan khusus kami, dan kami akan menjalankan aplikasi dalam mod universal, yang memastikan bahawa kami akan membuat laman web kami di pelayan. Apabila anda telah menetapkan semua kebenaran yang diperlukan, proses pemasangan akan bermula, dan semua fail konfigurasi akan dibuat.

Permulaan Awal

Setelah semuanya dimuat turun, ubah direktori ke folder yang baru anda buat.

cd app

Sekarang kita boleh memulakan pelayan pembangunan Nuxt.js.

npm run dev

Perintah ini akan membina laman web menggunakan paket web, yang merupakan modul bundler, dan melayani laman web di port localhost, yang biasanya akan menjadi port 3000. Ini juga akan memberi anda akses ke modul tambah nilai panas, yang akan menghilangkan keperluan untuk memulakan semula aplikasi setiap kali anda menukar fail. Oleh kerana kami menjalankan aplikasi dalam mod universal, aplikasi akan dikompilasi pada klien dan pelayan. Sekarang aplikasi anda akan berjalan di port 3000.

Bangunan Untuk Pengeluaran

Mod pembangunan cukup berguna apabila anda sedang giat membangunkan permohonan anda. Walau bagaimanapun, apabila anda sudah bersedia untuk membuat permohonan anda awam, addons seperti alat pengemaskinian panas dan pemaju menjadi kurang penting. Inilah sebabnya mengapa kami mahu membina permohonan kami sekali, untuk persekitaran pengeluaran. Untungnya, Nuxt.js termasuk alat yang boleh kita gunakan untuk membina modul aplikasi kami dengan cepat untuk pengeluaran. Jalankan yang berikut untuk memulakan proses membina pengeluaran.

npm run build

Pada asasnya, apa yang kita lakukan di sini adalah kita menyusun semua modul webpack kami, dengan pengoptimuman untuk pengeluaran.

Apabila binaan selesai, anda akan dapat menjalankan tapak untuk pengeluaran.

npm start

Kini, jika anda menavigasi http://yourip:3000, anda akan melihat skrin percikan Nuxt.js, yang mengesahkan bahawa anda sedang menjalankan mod pengeluaran.

PM2: Urus aplikasi anda dengan senang

Sekarang kita memahami dasar-dasar menjalankan aplikasi kami untuk pengeluaran. Dari segi persekitaran pengeluaran, kami lebih suka cara yang baik untuk memastikan aplikasi kami berjalan selama-lamanya, auto-restart permohonan kami apabila perlu, dan memantau sumber aplikasi kami. Itulah di mana Proses Manager 2 (PM2) masuk. PM2 adalah pengurus proses Node.js untuk aplikasi pengeluaran, yang termasuk banyak alat pengeluaran penting seperti pengimbangan beban, log terperinci, skrip permulaan, dan banyak lagi. Pertama, pasangkan PM2.

npm install pm2 -g

Ini memasang PM2 secara global supaya kami boleh menggunakannya di mana-mana sahaja di pelayan kami. Setelah PM2 selesai memuat turun, kami boleh memulakan permohonan kami.

pm2 start <appfolder>/server/index.js

Ambil perhatian bahawa kami memulakan fail pelayan yang terletak di dalam akar aplikasi kami.

Sekiranya anda ingin melihat sumber yang digunakan oleh aplikasi anda, anda boleh melakukannya dengan pm2 monitperintah. Ini akan memunculkan antara muka yang serupa dengan ncurses, di mana anda dapat mengumpulkan data mengenai penggunaan RAM, CPU, dan cakera dengan tepat.

Sekarang, aplikasi anda akan berjalan persis seperti saat kami menjalankannya dengan npm lebih awal, kecuali sekarang kami memiliki lebih banyak kawalan ketika datang ke pengoptimuman produksi.

Anda kini mempunyai aplikasi Nuxt.js build yang digunakan untuk pengeluaran dengan Node.js dan Ubuntu 18.04. Sekiranya anda ingin mengetahui lebih lanjut mengenai Nuxt, dan semua ciri mendalamnya, sila lawati dokumentasi rasmi mereka .