vite vue3 config配置篇

关于vite初始化项目参考自 https://vitejs.cn/
配置基于自生产上线项目所使用配置

vite.config.js

导入模块内容

import { defineConfig } from 'vite' #vite配置
import vue from '@vitejs/plugin-vue' #vue
import vueJsx from '@vitejs/plugin-vue-jsx' #支持jsx
import viteSvgIcons from 'vite-plugin-svg-icons' # svg
import { resolve } from "path"; # 引用项目地址
import OptimizationPersist from 'vite-plugin-optimize-persist' 
import PkgConfig from 'vite-plugin-package-config' #解决加载缓慢自动填充package.json
import legacy from '@vitejs/plugin-legacy' #浏览器兼容
import importToCDN from 'vite-plugin-cdn-import' # node_modules内容走CDN配置 缓解打包过大加载慢(服务器带宽不够)

配置alias

// search path
const pathResolve = (dir) => {
  return resolve(__dirname, ".", dir);
};

//set alias
const alias = [
  {
    find: '@',
    replacement: pathResolve("src")
  },
  {
    find: '~',
    replacement: pathResolve("./")
  },
  {
    find: "@build",
    replacement: pathResolve("build")}
];

defineConfig server

server:{
    https: false, //本地环境不用https
    hrm: true,
    port: 8080, //本地端口
    host: '0.0.0.0', 
    proxy: { //反向代理配置
      '/api': {
        target: 'http://localhost:8090/',
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, '')
      }
    },
  },