Analisis ringkas tentang di mana halaman statik yang disusun oleh vue berada

Vue ialah rangka kerja JavaScript popular yang membolehkan kami mencipta aplikasi web interaktif dengan lebih mudah. Salah satu kelebihan Vue ialah ia menggunakan DOM maya untuk mengurus pelbagai komponen halaman web, yang menjadikan pengemaskinian data dan paparan pada peringkat komponen lebih cekap.

Namun, apabila kami menggunakan Vue untuk menulis aplikasi web, kami akan menemui masalah: semasa proses pembangunan, komponen Vue yang kami tulis biasanya wujud dalam bentuk fail .vue, dan fail ini tidak boleh digunakan secara langsung dalam pengeluaran. Dalam persekitaran pengeluaran, kita mesti menyusun komponen ini ke dalam fail HTML, CSS dan JavaScript statik sebelum mengaturnya ke pelayan web. Jadi persoalannya ialah: di manakah fail statik yang disusun ini akan diletakkan?

Jawapannya mudah: apabila kami menggunakan Vue dalam pengeluaran, kami perlu menggunakan Vue CLI untuk membina aplikasi kami, yang secara automatik akan menyusun komponen Vue kami ke dalam fail HTML, CSS dan JavaScript statik, dan meletakkannya dalam direktori ./dist. Direktori ini dijana secara automatik oleh Vue CLI dan mengandungi semua sumber statik aplikasi kami.

Dalam direktori ./dist, kita akan melihat struktur fail yang serupa dengan yang berikut:

dist/
├── css/
│   ├── app.1a2b3c4d.css
│   └── chunk-vendors.5e6f7g8h.css
├── js/
│   ├── app.1a2b3c4d.js
│   ├── app.1a2b3c4d.js.map
│   ├── chunk-vendors.5e6f7g8h.js
│   └── chunk-vendors.5e6f7g8h.js.map
└── index.html

Dalam struktur fail ini, kita boleh melihat fail index.html, Ini adalah kami fail kemasukan dan titik permulaan untuk pelayar mengakses aplikasi kami. Kami juga boleh melihat direktori css dan direktori js, yang masing-masing mengandungi fail CSS dan JavaScript yang diperlukan oleh aplikasi. Antaranya, rentetan aksara dalam nama fail ialah nilai cincang kod sumber untuk memudahkan caching dan pengemaskinian.

Kami boleh menggunakan semua fail dalam direktori ./dist ke pelayan web dan kemudian mengakses aplikasi kami melalui penyemak imbas. Jika kami ingin mengurangkan operasi manual apabila menggunakan Vue, kami juga boleh menggunakan alatan penggunaan automatik seperti Jenkins untuk membina dan menggunakan aplikasi kami secara automatik.

Ringkasnya, komponen dalam Vue perlu disusun melalui Vue CLI dalam persekitaran pengeluaran dan fail yang disusun disimpan dalam direktori ./dist. Kami boleh menggunakan fail statik dalam direktori ./dist ke pelayan web dan mengakses aplikasi kami melalui penyemak imbas.

Atas ialah kandungan terperinci Analisis ringkas tentang di mana halaman statik yang disusun oleh vue berada. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!