vite中将css,js文件归类至文件夹

复制代码
  build: {
    chunkSizeWarningLimit: 1500,
    rollupOptions: {
      output: {
        // 最小化拆分包
        manualChunks(id) {
          if (id.includes('node_modules')) {
            return id.toString().split('node_modules/')[1].split('/')[0].toString()
          }
        },
        // 用于从入口点创建的块的打包输出格式[name]表示文件名,[hash]表示该文件内容hash值
        entryFileNames: 'js/[name].[hash].js',
        // 用于命名代码拆分时创建的共享块的输出命名
        //   chunkFileNames: 'js/[name].[hash].js',
        // 用于输出静态资源的命名,[ext]表示文件扩展名
        assetFileNames: '[ext]/[name].[hash].[ext]',
        // 拆分js到模块文件夹
        chunkFileNames: (chunkInfo) => {
          const facadeModuleId = chunkInfo.facadeModuleId ? chunkInfo.facadeModuleId.split('/') : []
          const fileName = facadeModuleId[facadeModuleId.length - 2] || '[name]'
          return `js/${fileName}/[name].[hash].js`
        },
      },
    },
  }

有写base的话,也会自动拼接base对应的路径

打包后的结果,已被规整分类

相关推荐
爱学习的程序媛30 分钟前
【Web前端】深入解析JavaScript异步编程
开发语言·前端·javascript·ecmascript·web
梧桐16831 分钟前
马克沁机枪上阵(二):前线开辟—Claude Code 如何用一天打通前端
前端
是上好佳佳佳呀34 分钟前
【前端(一)】HTML 知识梳理:从结构到常用标签
前端·html
楚轩努力变强38 分钟前
2026 年前端进阶:端侧大模型 + WebGPU,从零打造高性能 AI 原生前端应用
前端·typescript·大模型·react·webgpu·ai原生·高性能前端
放下华子我只抽RuiKe541 分钟前
深度学习 - 01 - NLP自然语言处理基础
前端·人工智能·深度学习·神经网络·自然语言处理·矩阵·easyui
酉鬼女又兒1 小时前
零基础入门前端 第十三届蓝桥杯省赛 :水果拼盘 Flex一篇过(可用于备赛蓝桥杯Web应用开发)
前端·css·职场和发展·蓝桥杯·css3
wefly20171 小时前
m3u8live.cn:免安装 HLS 在线播放器,流媒体调试效率神器
开发语言·javascript·python·django·ecmascript·hls.js 原理·m3u8 解析
J_liaty1 小时前
JavaScript 基础知识全解析:从入门到精通
开发语言·javascript
weixin199701080161 小时前
《苏宁商品详情页前端性能优化实战》
前端·性能优化