Bagaimana untuk menjalankan projek vue pada pelayan (langkah)

Vue ialah rangka kerja bahagian hadapan yang popular yang membantu pembangun membina aplikasi web moden dengan cepat. Walau bagaimanapun, Vue berjalan dalam penyemak imbas secara lalai. Jika anda ingin menjalankan aplikasi Vue pada pelayan, anda perlu mengambil beberapa langkah tambahan untuk menyelesaikannya.

Dalam artikel ini, kami akan menyelami cara menjalankan aplikasi Vue pada pelayan supaya anda boleh menggunakan aplikasi anda dengan mudah di mana-mana, sama ada awan atau pelayan setempat.

Langkah 1: Pasang Node.js

Untuk menjalankan aplikasi Vue pada pelayan, anda perlu memasang Node.js terlebih dahulu. Node.js ialah persekitaran masa jalan JavaScript berdasarkan enjin Chrome V8, yang membolehkan anda melaksanakan kod JavaScript pada bahagian pelayan. Anda boleh memuat turun versi yang sesuai untuk sistem anda daripada tapak web rasmi Node.js.

Selepas pemasangan selesai, anda boleh menyemak sama ada Node.js telah berjaya dipasang dengan memasukkan arahan node -v dalam terminal.

Langkah 2: Pasang Vue CLI

Vue CLI ialah alat baris arahan yang boleh membantu kami membuat aplikasi Vue dengan cepat. Untuk menjalankan aplikasi Vue pada pelayan, kita perlu menggunakan Vue CLI untuk mencipta struktur asas aplikasi Vue.

Memasang Vue CLI adalah mudah, cuma masukkan arahan berikut dalam terminal:

npm install -g @vue/cli

Arahan ini akan memasang versi terkini Vue CLI secara global.

Langkah 3: Buat aplikasi Vue

Selepas memasang Vue CLI, kami boleh menggunakannya untuk mencipta aplikasi Vue baharu.

Dalam terminal, pergi ke direktori tempat anda ingin mencipta aplikasi dan masukkan arahan berikut:

vue create my-app

Arahan ini akan mencipta aplikasi Vue baharu bernama my-app.

Proses pemasangan akan menggesa anda untuk memilih beberapa pilihan, seperti konfigurasi aplikasi, pemalam untuk digunakan, dsb. Anda boleh memilih mengikut keperluan anda.

Selepas melengkapkan langkah ini, Vue CLI akan memasang kebergantungan yang diperlukan secara automatik dan mencipta struktur aplikasi asas.

Langkah 4: Mulakan pelayan setempat

Selepas mencipta aplikasi Vue baharu, kami boleh menggunakan pelayan pembangunan Webpack terbina dalam untuk menjalankan aplikasi. Pelayan ini bukan sahaja menyediakan persekitaran pelayan asas, tetapi juga secara automatik menyusun semula kod dalam aplikasi dan memaparkan perubahan terkini dalam penyemak imbas dalam masa nyata.

Dalam direktori aplikasi, kita boleh menggunakan arahan berikut untuk memulakan pelayan:

npm run serve

Arahan ini akan memulakan pelayan setempat dan secara automatik membuka penyemak imbas lalai untuk mengakses program aplikasi. Anda boleh melihat dalam penyemak imbas bahawa aplikasi Vue anda telah berjaya dijalankan. Walau bagaimanapun, pelayan ini hanya tempatan, dan jika kami ingin menjalankan aplikasi Vue pada pelayan, kami memerlukan kaedah lain.

Langkah 5: Terbitkan fail ke pelayan

Jika kami ingin menjalankan aplikasi Vue pada pelayan, kami perlu menggunakan kod aplikasi pada pelayan. Kaedah yang paling biasa ialah menggunakan Git untuk menolak kod ke pelayan, dan kemudian menjalankan aplikasi pada pelayan menggunakan Node.js.

Pada pelayan, kami boleh menggunakan aplikasi Vue kami menggunakan langkah berikut:

1. Pasang Node.js dan Git pada pelayan.
2. Klon repositori jauh aplikasi menggunakan Git.

3. Pergi ke dalam direktori aplikasi dan pasang kebergantungan yang diperlukan.

   cd my-app
   npm install

4. Bina versi pengeluaran aplikasi.

   npm run build

   Arahan ini akan membungkus kod aplikasi dan menjana fail statik yang boleh dilaksanakan pada pelayan.

5. Gunakan Node.js pada pelayan untuk menjalankan aplikasi.

   node server.js

   server.js ialah fail pelayan Node.js ringkas yang akan mengendalikan semua permintaan HTTP dan menghantar semula fail statik ke penyemak imbas.

Selepas melengkapkan langkah di atas, aplikasi Vue kami boleh berjalan dengan jayanya pada pelayan. Anda boleh melawati URL pelayan untuk melihat aplikasi anda.

Ringkasan

Dalam artikel ini, kami menyelam lebih mendalam tentang cara menjalankan aplikasi Vue pada pelayan. Kami mencipta struktur asas aplikasi Vue kami dengan memasang Node.js dan Vue CLI. Kami juga mempelajari cara menjalankan aplikasi menggunakan pelayan pembangunan Webpack terbina dalam dan cara menggunakan aplikasi pada pelayan dengan membina versi pengeluaran aplikasi.

Untuk berjaya menjalankan aplikasi Vue pada pelayan, pemahaman asas tentang Node.js dan pembangunan web diperlukan. Terdapat berbilang langkah yang diperlukan untuk menjalankan aplikasi anda, tetapi apabila anda sudah biasa dengannya, anda akan dapat menggunakan aplikasi Vue anda dengan mudah di mana-mana sahaja.

Atas ialah kandungan terperinci Bagaimana untuk menjalankan projek vue pada pelayan (langkah). Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!