cari
Rumahhujung hadapan webView.jsvue.js打包后图片路径错误怎么办

vue.js打包后图片路径错误的解决办法:1、修改【assetsPublicPath: './'】;2、打开【webpack.prod.conf.js】,在output增加【publicPath: './'】。

vue.js打包后图片路径错误怎么办

vue.js打包后图片路径错误的解决办法:

【相关文章推荐:vue.js

解决办法如图:

(1)、

47ea417fd9bae4ceb667f583c937e20.png

修改assetsPublicPath: './'

(2)、打开webpack.prod.conf.js,在output:增加publicPath: './'

59e6b016db80e07e42a968f00dfb177.png

虽然解决了资源路径的引用问题,但是资源里面的背景图片还是不显示, background: url("../../assets/images/logo-index.png") no-repeat;被相对打包后变成了url(static/img/logo-index.2fbf2.png) no-repeat所以我们要保留css引用图片的正常路径,即:url(../../static/img/logo-index.2fbf2.png) no-repeat

那么就需要修改build文件夹下的utils.js代码,如图所示:

6f3b90ca5ee364f5446549b1263999f.png

添加publicPath:'../../'这一行代码,这样不论是字体还是图片的引用问题都能解决。

相关免费学习推荐:javascript(视频)

Atas ialah kandungan terperinci vue.js打包后图片路径错误怎么办. 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
Vue.js vs React: kemudahan penggunaan dan keluk pembelajaranVue.js vs React: kemudahan penggunaan dan keluk pembelajaranMay 02, 2025 am 12:13 AM

Vue.js lebih mudah digunakan dan mempunyai lengkung pembelajaran yang lancar, yang sesuai untuk pemula; React mempunyai lengkung pembelajaran yang lebih curam, tetapi mempunyai fleksibiliti yang kuat, yang sesuai untuk pemaju yang berpengalaman. 1.vue.js mudah dimulakan melalui reka bentuk pengikatan data mudah dan progresif. 2. REACT memerlukan pemahaman tentang DOM dan JSX maya, tetapi memberikan kelebihan fleksibiliti dan prestasi yang lebih tinggi.

Vue.js vs React: Rangka kerja mana yang sesuai untuk anda?Vue.js vs React: Rangka kerja mana yang sesuai untuk anda?May 01, 2025 am 12:21 AM

Vue.js sesuai untuk pembangunan pantas dan projek kecil, sementara React lebih sesuai untuk projek besar dan kompleks. 1.vue.js adalah mudah dan mudah dipelajari, sesuai untuk pembangunan pesat dan projek kecil. 2. REACT adalah kuat dan sesuai untuk projek besar dan kompleks. 3. Ciri -ciri progresif Vue.js sesuai untuk memperkenalkan fungsi secara beransur -ansur. 4. DOM Componented dan Maya React berfungsi dengan baik apabila berurusan dengan aplikasi UI dan intensif data yang kompleks.

Vue.js vs React: Analisis Perbandingan Kerangka JavaScriptVue.js vs React: Analisis Perbandingan Kerangka JavaScriptApr 30, 2025 am 12:10 AM

Vue.js dan bertindak balas masing -masing mempunyai kelebihan dan kekurangan mereka sendiri. Apabila memilih, anda perlu mempertimbangkan secara komprehensif kemahiran pasukan, saiz projek dan keperluan prestasi. 1) Vue.js sesuai untuk pembangunan cepat dan projek kecil, dengan lengkung pembelajaran yang rendah, tetapi objek bersarang yang mendalam dapat menyebabkan masalah prestasi. 2) React sesuai untuk aplikasi besar dan kompleks, dengan ekosistem yang kaya, tetapi kemas kini yang kerap boleh menyebabkan kemunculan prestasi.

Vue.js vs React: Gunakan Kes dan AplikasiVue.js vs React: Gunakan Kes dan AplikasiApr 29, 2025 am 12:36 AM

Vue.js sesuai untuk projek kecil dan sederhana, manakala React sesuai untuk projek besar dan senario aplikasi yang kompleks. 1) Vue.js mudah digunakan dan sesuai untuk prototaip cepat dan aplikasi kecil. 2) React mempunyai lebih banyak kelebihan dalam mengendalikan pengurusan negara yang kompleks dan pengoptimuman prestasi, dan sesuai untuk projek besar.

Vue.js vs React: Membandingkan prestasi dan kecekapanVue.js vs React: Membandingkan prestasi dan kecekapanApr 28, 2025 am 12:12 AM

Vue.js dan bertindak balas masing -masing mempunyai kelebihan mereka sendiri: vue.js sesuai untuk aplikasi kecil dan perkembangan pesat, sementara React sesuai untuk aplikasi besar dan pengurusan negara yang kompleks. 1.vue.js Menyedari kemas kini automatik melalui sistem responsif, sesuai untuk aplikasi kecil. 2. REACT menggunakan algoritma DOM dan Diff Virtual, yang sesuai untuk aplikasi besar dan kompleks. Apabila memilih rangka kerja, anda perlu mempertimbangkan keperluan projek dan timbunan teknologi pasukan.

Vue.js vs React: Komuniti, Ekosistem, dan SokonganVue.js vs React: Komuniti, Ekosistem, dan SokonganApr 27, 2025 am 12:24 AM

Vue.js dan bertindak balas masing -masing mempunyai kelebihan sendiri, dan pilihan harus berdasarkan keperluan projek dan tumpukan teknologi pasukan. 1. Vue.js adalah mesra komuniti, menyediakan sumber pembelajaran yang kaya, dan ekosistem termasuk alat rasmi seperti Vuerouter, yang disokong oleh pasukan rasmi dan masyarakat. 2. Komuniti React adalah berat sebelah terhadap aplikasi perusahaan, dengan ekosistem yang kuat, dan sokongan yang disediakan oleh Facebook dan komuniti, dan mempunyai kemas kini yang kerap.

React dan Netflix: Meneroka HubunganReact dan Netflix: Meneroka HubunganApr 26, 2025 am 12:11 AM

Netflix menggunakan React untuk meningkatkan pengalaman pengguna. 1) Ciri -ciri komponen React membantu Netflix Split Complex UI ke dalam modul yang boleh diurus. 2) Maya DOM mengoptimumkan kemas kini UI dan meningkatkan prestasi. 3) Menggabungkan Redux dan GraphQL, Netflix dengan cekap menguruskan status aplikasi dan aliran data.

VUE.JS vs Rangka Kerja Backend: Menjelaskan perbezaanVUE.JS vs Rangka Kerja Backend: Menjelaskan perbezaanApr 25, 2025 am 12:05 AM

Vue.js adalah kerangka depan, dan rangka kerja belakang digunakan untuk mengendalikan logik sisi pelayan. 1) Vue.js memberi tumpuan kepada membina antara muka pengguna dan memudahkan pembangunan melalui pengikatan data komponen dan responsif. 2) Rangka kerja back-end seperti Express dan Django mengendalikan permintaan HTTP, operasi pangkalan data dan logik perniagaan, dan dijalankan di pelayan.

See all articles

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Alat panas

SecLists

SecLists

SecLists ialah rakan penguji keselamatan muktamad. Ia ialah koleksi pelbagai jenis senarai yang kerap digunakan semasa penilaian keselamatan, semuanya di satu tempat. SecLists membantu menjadikan ujian keselamatan lebih cekap dan produktif dengan menyediakan semua senarai yang mungkin diperlukan oleh penguji keselamatan dengan mudah. Jenis senarai termasuk nama pengguna, kata laluan, URL, muatan kabur, corak data sensitif, cangkerang web dan banyak lagi. Penguji hanya boleh menarik repositori ini ke mesin ujian baharu dan dia akan mempunyai akses kepada setiap jenis senarai yang dia perlukan.

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

DVWA

DVWA

Damn Vulnerable Web App (DVWA) ialah aplikasi web PHP/MySQL yang sangat terdedah. Matlamat utamanya adalah untuk menjadi bantuan bagi profesional keselamatan untuk menguji kemahiran dan alatan mereka dalam persekitaran undang-undang, untuk membantu pembangun web lebih memahami proses mengamankan aplikasi web, dan untuk membantu guru/pelajar mengajar/belajar dalam persekitaran bilik darjah Aplikasi web keselamatan. Matlamat DVWA adalah untuk mempraktikkan beberapa kelemahan web yang paling biasa melalui antara muka yang mudah dan mudah, dengan pelbagai tahap kesukaran. Sila ambil perhatian bahawa perisian ini

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

MinGW - GNU Minimalis untuk Windows

MinGW - GNU Minimalis untuk Windows

Projek ini dalam proses untuk dipindahkan ke osdn.net/projects/mingw, anda boleh terus mengikuti kami di sana. MinGW: Port Windows asli bagi GNU Compiler Collection (GCC), perpustakaan import yang boleh diedarkan secara bebas dan fail pengepala untuk membina aplikasi Windows asli termasuk sambungan kepada masa jalan MSVC untuk menyokong fungsi C99. Semua perisian MinGW boleh dijalankan pada platform Windows 64-bit.