vite打包配置

huyoCat

已于 2023-10-17 18:21:48 修改

阅读量560

点赞数

分类专栏： web 文章标签：前端 javascript

于 2023-10-17 18:20:08 首次发布

本文链接：https://blog.csdn.net/huyoCat/article/details/133890121

版权

web 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

清除所有的console和debugger

在vite.config.js的defineConfig增加如下配置：

esbuild: {
    drop: ['console', 'debugger'], // 删除 所有的console 和 debugger
}

如有以下提示信息，可使用下面代码进行js分包

(!) Some chunks are larger than 500 kBs after minification. Consider:
- Using dynamic import() to code-split the application
- Use build.rollupOptions.output.manualChunks to improve chunking: https://rollupjs.org/configuration-options/#output-manualchunks
- Adjust chunk size limit for this warning via build.chunkSizeWarningLimit.

JS分文件打包

在vite.config.js的defineConfig增加如下配置：

  build: {
    // chunkSizeWarningLimit: 1500,//配置文件大小提醒限制，默认500
    rollupOptions: {
      output: {
        //每个node_modules模块分成一个js文件
        manualChunks(id) {
          if (id.includes('node_modules')) {
            return id.toString().split('node_modules/')[1].split('/')[0].toString()
          }
        },
        // 用于从入口点创建的块的打包输出格式[name]表示文件名,[hash]表示该文件内容hash值
        entryFileNames: 'assets/js/[name].[hash].js', // 用于命名代码拆分时创建的共享块的输出命名
        chunkFileNames: 'assets/js/[name].[hash].js', // 用于输出静态资源的命名，[ext]表示文件扩展名
        assetFileNames: 'assets/[ext]/[name].[hash].[ext]'
      }
    }
  },