vite.config常用配置

lunaʚゞɞ

已于 2023-02-02 10:13:06 修改

阅读量1.1k

点赞数

文章标签：前端 javascript 开发语言

于 2023-02-01 16:46:15 首次发布

本文链接：https://blog.csdn.net/noctis99/article/details/128836477

版权

本文介绍了在使用Vite构建Vue3项目时遇到的配置问题，包括Vite-plugin-vue-setup-extend、vite-plugin-compression和@vitejs/plugin-legacy的安装与版本匹配，以及解决'Cannot destructure property'的错误。此外，还提到了build.terserOptions的配置，以及在Vite中遇到的assetFileNames图片打包、static目录下js文件与iframe加载冲突和build打包后文件清理不彻底的三个bug，并给出了相应的解决方案。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

npm i vite-plugin-vue-setup-extend -D

npm install vite-plugin-compression -D

npm install -D @vitejs/plugin-legacy@1.8.2 //vite为2.x时

Cannot destructure property 'renderBuiltUrl' of 'config.experimental' as it is undefined.

报如下错误的原因是：vite版本和@vitejs/plugin-legacy版本没有对应，因为plugin-legacy版本为2.x后，vite版本需要为3.x版本,要么升级vite版本3x要么@vitejs/plugin-legacy降级为2x一下

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { resolve } from 'path';
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import ElementPlus from 'unplugin-element-plus/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
import {
  createStyleImportPlugin,
  ElementPlusResolve,
} from 'vite-plugin-style-import'

import legacyPlugin from '@vitejs/

最低0.47元/天解锁文章