vue3 中vite.config.js相关常用配置详解

base（默认为/）开发或生产环境服务的公共基础路径。合法的值包括以下几种：

绝对 URL 路径名，例如 /foo/ 部署在根目录下的foo文件下页面路径为： https://foo.com/foo/
完整的 URL，例如 https://foo.com/（默认为/）部署在根目录下
空字符串或 ./（用于嵌入形式的开发）可用于部署在任何路径下

** 注意点：**
== vue3 vite.config.js 中配置的base路径，当访问过程中需要使用动态连接的 url 时，可以使用全局注入的 import.meta.env.BASE_URL 变量，它的值为公共基础路径；vue2 中通过process.env.BASE_URL 获取 ==

plugins：插件列表，可以是自定义的Vite插件或第三方插件，用于扩展Vite功能

resolve：用于配置模块解析。例如，可以设置resolve.alias来设置路径别名，简化导入语句。

server：配置开发服务器。例如，可以设置server.port来指定端口，或者server.host来指定主机

build：配置构建输出

import path from 'node:path'
import { fileURLToPath } from 'node:url'
import { build } from 'vite'
import vue from '@vitejs/plugin-vue'
const __dirname = fileURLToPath(new URL('.', import.meta.url))
export default defineConfig({base: '/screen',//指定了应用程序在服务器上的根目录位置，设置连接前缀plugins: [vue(),],resolve: {alias: {'@': fileURLToPath(new URL('./src', import.meta.url))}},server: {open: '/docs/index.html',//开发服务器启动时，自动在浏览器中打开应用程序。proxy: {//代理port: 3000,host: 'localhost',cors： true,//为开发服务器配置 CORS。默认启用并允许任何源，传递一个 选项对象 来调整行为或设为 false 表示禁用。// 字符串简写写法：http://localhost:5173/foo -> http://localhost:4567/foo'/foo': 'http://localhost:4567',// 带选项写法：http://localhost:5173/api/bar -> http://jsonplaceholder.typicode.com/bar'/api': {target: 'http://jsonplaceholder.typicode.com',changeOrigin: true,rewrite: (path) => path.replace(/^\/api/, ''),},build: {outDir: 'dist',//指定输出路径（相对于 项目根目录).assetsDir: 'assets',//指定生成静态资源的存放路径rollupOptions: {// ...}}
})