直接上代理
两个插件
"@vitejs/plugin-legacy": "^5.3.1",
"vite-plugin-compression": "^0.5.1",
vite.config.ts配置
import viteCompression from "vite-plugin-compression";
import legacy from "@vitejs/plugin-legacy";
plugins: [
vue(),
legacy({
targets: ["defaults", "not IE 11"],
}),
viteCompression({
verbose: false, // 不显示gzip压缩信息
threshold: 1024 * 10, // 10kb
}),
],
完整配置
import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
import { resolve } from "path";
import postcssPxToViewport from "postcss-px-to-viewport";
import viteCompression from "vite-plugin-compression";
import legacy from "@vitejs/plugin-legacy";
// https://vitejs.dev/config/
export default defineConfig({
plugins: [
vue(),
legacy({
targets: ["defaults", "not IE 11"],
}),
viteCompression({
verbose: false, // 不显示gzip压缩信息
threshold: 1024 * 10, // 10kb
}),
],
resolve: {
alias: [
{
find: "@",
replacement: resolve(__dirname, "src"),
},
],
extensions: [".js", ".ts", ".jsx", ".tsx", ".json", ".vue"],
},
base: "./",
build: {
outDir: "dist",
assetsDir: "assets", //指定静态资源存放路径
sourcemap: false, //是否构建source map 文件
// terserOptions: {
// // 生产环境移除console
// compress: {
// drop_console: true,
// drop_debugger: true,
// },
// },
},
server: {
port: 5160,
proxy: {
"/api": {
target: "http://192.168.1111.11111:5173",
changeOrigin: true, //是否跨域
rewrite: (path) => path.replace(/^\/api/, ""),
},
},
},
css: {
// postcss: {
// plugins: [
// postcssPxToViewport({
// unitToConvert: "px", // 要转化的单位
// viewportWidth: 1920, // UI设计稿的宽度
// unitPrecision: 6, // 转换后的精度,即小数点位数
// propList: ["*"], // 指定转换的css属性的单位,*代表全部css属性的单位都进行转换
// viewportUnit: "vw", // 指定需要转换成的视窗单位,默认vw
// fontViewportUnit: "vw", // 指定字体需要转换成的视窗单位,默认vw
// // minPixelValue: 1, // 默认值1,小于或等于1px则不进行转换
// mediaQuery: true, // 是否在媒体查询的css代码中也进行转换,默认false
// replace: true, // 是否转换后直接更换属性值
// selectorBlackList: [".ignore"], // 指定不转换为视窗单位的类,可以自定义,可以无限添加,建议定义一至两个通用的类名
// exclude: [/node_modules/,/src1/], // 设置忽略文件,用正则做目录名匹配
// landscape: false, // 是否处理横屏情况
// // include:['src/views/home/home.vue']
// }),
// ],
// },
},
});