Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk menyelesaikan masalah yang menukar laluan permulaan vue tidak berkuat kuasa

Bagaimana untuk menyelesaikan masalah yang menukar laluan permulaan vue tidak berkuat kuasa

PHPz
PHPzasal
2023-04-13 10:44:101209semak imbas

Semasa saya membangun menggunakan rangka kerja Vue baru-baru ini, saya menghadapi masalah, iaitu, mengubah suai laluan permulaan projek Vue tidak berkuat kuasa Ia masih menjadi localhost yang diakses lalai:8080 dan bukannya laluan tersuai. Selepas beberapa penyelidikan dan percubaan, saya menemui penyelesaian kepada masalah ini dan menulis artikel ini, dengan harapan dapat membantu lebih ramai pembangun yang menghadapi masalah yang sama.

Pertama, mari kita lihat laluan permulaan lalai projek Vue. Dalam projek Vue, kami menggunakan templat asas yang dijana oleh vue-cli scaffolding Struktur projek yang dihasilkan adalah seperti berikut:

projectName
│   package-lock.json
│   package.json
│   README.md
│
├───public
│       favicon.ico
│       index.html
│
└───src
        App.vue
        main.js

Antaranya, public di bawah folder index.html ialah. fail kemasukan projek Vue , di mana kita boleh menggunakan pembolehubah <%= BASE_URL %> untuk mewakili laluan akar projek. Mod lalai Vue adalah untuk bermula berdasarkan laluan /, iaitu localhost:8080/. Apabila saya cuba mengubah suai laluan lalai ini dalam fail vue.config.js, ia tidak pernah berkuat kuasa.

Menurut pengenalan dalam dokumentasi rasmi Vue, kod berikut hendaklah ditambahkan pada fail vue.config.js:

module.exports = {
    publicPath: '/newpath/'
}

Dengan cara ini, laluan permulaan projek boleh diubah suai kepada localhost:8080/newpath/. Walau bagaimanapun, selepas percubaan, kaedah ini tidak berfungsi dalam projek kami Sebabnya ialah projek kami menggunakan nama domain peringkat kedua untuk akses, seperti http://myproject.example.com, bukannya kaedah akses laluan http://example.com/myproject.

Oleh itu, kita perlu menambah laluan akar projek secara manual dalam public di bawah folder index.html. Cari teg index.html dalam fail <head> dan kami boleh menambah kod berikut:

<base href="/newpath/">

/newpath/ di sini ialah laluan permulaan tersuai kami. Dengan cara ini, tidak kira bagaimana kami mengubah suai vue.config.js dalam fail publicPath, kami boleh mengakses projek dengan betul. Pada masa yang sama, kami juga boleh menukar laluan kepada /, supaya kami boleh mengakses projek melalui nama domain peringkat kedua.

Ringkasnya, tidak kira bagaimana kita mengubah suai laluan permulaan projek Vue, kita perlu menetapkannya secara manual, bukan hanya membuat tetapan dalam fail vue.config.js. Dalam projek sebenar, mengkonfigurasi laluan permulaan yang betul akan menjadi langkah yang sangat penting.

Atas ialah kandungan terperinci Bagaimana untuk menyelesaikan masalah yang menukar laluan permulaan vue tidak berkuat kuasa. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn