开发环境配置

root

1 .项目的根目录，index.html 所在的位置，可以是绝对路径，也可以是基于vite.config.js 的相对路径，默认值是process.cwd()

mode

1 .默认，开发为development，生成为production.通过mode选项可以覆盖serve 和 build命令对应的模式

define

1 .定义可以替换的全局变量

配置css常量

1 .将全部变量定义在一个变量文件里面
$injectedColor: orange;
$injectedFontSize: 16px;

2 .将全局变量引入文件
css: {
    preprocessorOptions: {
      scss: {
        additionalData: `@import '/src/assets/styles/variables.scss';` // 引入全局变量文件
      }
    }

base

1 .开发或者生产环境服务的公共基础路径

1 .绝对URL路径，例如/foo/
2 .完整的URL，例如https://foo.com
3 .空字符串或 ./ 用于嵌入形式的开发

plugins

1 .对应rollup插件

publicDir

1 .静态资源目录，build结束之后会复制到outDir目录下

cacheDir

1 .预构件文件的缓存目录。默认为node_modules/.vite

resolve

1 .文件解析配置，有alias,别名配置
2 .dedupe
3 .mainField

css

1 .css相关配置

json

1 .json相关配置

esbuild

1 .esbuild 配置

envDir

1 . .env 文件的根目录

envPrefix

1 .环境变量的前缀，默认为VITE_

troisjs

1 .一个类似于
2 .ThreeJS + VueJS 3 + ViteJS
3 .那我为啥不直接用threeJs 呢，还能少安装一个包，最后的资源还更小。
4 .

插件

1 .alias 用于在捆绑包时定义别名的 Rollup 插件

2 .vite-plugin-compression 前端文件Gzip压缩

3 .rollup-plugin-visualizer 打包产物分析

4 .vite-plugin-zip-file 将最后的文件