vue3+vite打包资源静态目录配置

最新推荐文章于 2024-03-30 10:34:00 发布

饭啦啦

最新推荐文章于 2024-03-30 10:34:00 发布

阅读量1.3k

点赞数 2

分类专栏： vite+vue3 文章标签： vue.js 前端 javascript

本文链接：https://blog.csdn.net/qq_36434345/article/details/134809315

版权

vite+vue3 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

vite.config.js配置如下

import { fileURLToPath, URL } from 'node:url'

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue(),
  ],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    }
  },
  build: {
    outDir: 'lsv_reading',
    minify: 'terser',
    cssCodeSplit: true,
    chunkSizeWarningLimit: 1500,
    rollupOptions: {
      input: 'index.html',
      output: {
        // 静态资源打包做处理
        chunkFileNames: 'lsv_reading/assets/js/[name]-[hash].js',
        entryFileNames: 'lsv_reading/assets/js/[name]-[hash].js',
        assetFileNames: 'lsv_reading/assets/[ext]/[name]-[hash].[ext]',
        manualChunks(id) {
          if (id.includes('node_modules')) {
            return id.toString().split('node_modules/')[1].split('/')[0].toString();
          }
        },
      },
    },
    terserOptions: {
      // 清除console和debugger
      compress: {
        drop_console: true,
        drop_debugger: true,
      },
    },
  },
  //代理配置
  server: {
    //使用IP能访问
    host: "0.0.0.0",
    // 热更新
    hmr: true,
    //设为 true 时若端口已被占用则会直接退出，而不是尝试下一个可用端口
    strictPort: false,
    //自定义代理规则
    proxy: {
      // 选项写法
      "/api": {
        target: "https://scho..",//这里写要代理的地址
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, ""),
      },
    },
  }
})