Problema de empaquetado de Vite+Vue3

Error de compilación que informa código confuso

执行 pnpm run build 后报错

Motivo: el sufijo de la imagen es .PNG, que se solucionará después de cambiarlo a .png.

La página de implementación está en blanco y la consola informa un error

Una vez completado el empaquetado, la página implementada en el servidor es blanca y se muestra la consola

Motivo: el archivo vite.config.js necesita configurar el campo base y el valor es la ubicación del archivo estático en el directorio raíz del servidor.

Configurar vite.config.js

export default defineConfig({
    
    
    plugins: [vue()],
    base: '/zhihu/'
})

ubicación del camino

La página de implementación está en blanco

Después de seguir los pasos anteriores, no se informa ningún error en la consola, pero la página sigue en blanco.

Configurar el archivo enrutador/index.js

const router = createRouter({
    
    
	/* 此处路径为最终页面相对服务器根目录地址 */
    history: createWebHistory('/zhihu/'),
    routes
})

Error en la ruta de la imagen

Consulte el procesamiento de recursos estáticos de Vite.

1. Utilice la importación para presentar

import imgUrl from './img.png'

2. Poner recursos en la carpeta pública.