【无标题】

vue3.x 开发配置

相关资料

vite打包配置(静态资源合并打包/清除log/gzip压缩/ENV配置等)
vue3+vite打包自动生成dist.zip压缩包------------试了下，没有成功，函数写的有问题
rollup-plugin-compression打包dist成zip压缩包---------似乎需要node版本15+

IE和旧版chrome兼容

vite.config.ts 配置代码

rollup-plugin-compression 可不加，需要兼容node16最新版本

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import vietEslintPlugin from 'vite-plugin-eslint'
import vueJsx from '@vitejs/plugin-vue-jsx'
import { resolve } from 'path'
import VueSetupExtend from 'vite-plugin-vue-setup-extend'
import legacy from '@vitejs/plugin-legacy'
import compresssionBuild from 'rollup-plugin-compression'
import type { ICompressionOptions } from 'rollup-plugin-compression'
const outDir = 'dist'
const option: ICompressionOptions = {
  sourceName: outDir,
  type: 'zip',
  targetName: outDir
}
// https://vitejs.dev/config/
export default defineConfig({
  base: './',
  plugins: [
    vue(),
    vietEslintPlugin({
      // 提示在项目运行时代码编写不规范，代码编写跟项目构建都能起到效果
      cache: false
    }),
    // 处理 安卓8.0显示白屏问题
    legacy({
      targets: ['ie >= 11'],
      additionalLegacyPolyfills: ['regenerator-runtime/runtime']
    }),

    VueSetupExtend(), // setup 支持name属性
    vueJsx({}), // jsx、tsx支持
    compresssionBuild(option) // vite 打包构建 压缩 dist 目录为 zip 文件
  ],
  resolve: {
    // 配置别名
    alias: [{ find: '@', replacement: resolve(__dirname, 'src') }]
  },
  css: {
    // 全局样式处理
    preprocessorOptions: {
      scss: {
        additionalData: '@import "@/styles/variables.scss";'
      }
    }
  },
  server: {
    proxy: {
      // 选项写法
      '/apis': {
        target: '', // 代理目标地址
        changeOrigin: true, // 代理基于名字的虚拟主机，代理服务会把origin修改为目标地址
        rewrite: path => path.replace(/^\/apis/, '') // 路径重写
      },
    },
    host: '0.0.0.0',
    port: 8994,
    // 是否开启 https
    https: false
  },
  build: {
    outDir: outDir,
    cssTarget: ['chrome61'],
    terserOptions: {
      compress: {
        drop_console: true, // 清除console和debugger
        drop_debugger: true
      }
    }
  }
})