Vue3 + Vite 打包静态资源使用相对路径

前言

Vue3 + Vite 打包静态资源使用相对路径

默认配置打包后文件预览

Vue3 静态资源相对路径打包配置

方法： 在defineConfig中添加 base: “./” (绝对路径用/)

完整示例：

export default defineConfig({
 build: {
   rollupOptions: {
     output: {
         // 在这里修改静态资源路径
       chunkFileNames: 'static/assets/js/[name]-[hash].js',
       entryFileNames: 'static/assets/js/[name]-[hash].js',
       assetFileNames: 'static/assets/[ext]/[name]-[hash].[ext]',
     }
   }
 },
 base: './', // 这里更改打包相对绝对路径
 minify: true, // 是否压缩代码
 sourceMap: true, // 是否生成sourceMap
 plugins: [vue(),basicSsl()],
 resolve: {
   alias: {
     '@': fileURLToPath(new URL('./src',
       import.meta.url))
   }
 },
 server: { // ← ← ← ← ← ←
   port: 8082,
   proxy: {
     '/rss': {
       target: ENV_URL, //要访问的地址
       changeOrigin: true,
       rewrite: (path) => path.replace(/^\/rss/, ""),
       // secure: false
     }
   },
   https:true,
   host: '0.0.0.0' // ← 新增内容 ←
 }
})

Vue Vue3 Vite Vuejs

https://www.leftso.com/article/240827110236979.html