vite项目初始化之~打包去掉console信息

插件推荐： xuwu(虚无)模板助手

介绍

本文介绍的是xuwu模版助手中的 生产环境去掉console ，这个模块相关代码，还会陆续更新相关的其他功能，比如ajax请求模版，consoleLog控制台，eslint+commit代码时统一风格，，移动端适配，ElementUi，VantUi，AntDesignUi的按需引入等。

环境变量引入

通常去掉console为生产环境，即需要引入环境变量。具体请看这篇文章: vite项目初始化之~环境变量

注意

与webpacak相比，vite已经将这个功能内置到了，所以我们只需要配置vite.config.js文件即可，起作用的文件包括drop_console去掉console信息drop_debugger为去掉debugger信息

修改vite.config.js文件

import { defineConfig, loadEnv } from 'vite'
import vue from '@vitejs/plugin-vue'

export default defineConfig(({ mode, command }) => ({
  build: { 
    minify: "terser", 
    terserOptions: { 
      compress: { 
        drop_console: command === "build" && loadEnv(mode, __dirname).VITE_API_ENV === "prod", 
        drop_debugger: command === "build" && loadEnv(mode, __dirname).VITE_API_ENV === "prod" 
      } 
    } 
  },
  plugins: [vue()]
}))

打包

命令: npm run build_prod