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对应的路径

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

相关推荐
Sunlightʊə37 分钟前
2.登录页测试用例
运维·服务器·前端·功能测试·单元测试
Code Crafter1 小时前
ES6-ES14 新特性速查
前端·ecmascript·es6
Lhuu(重开版1 小时前
CSS从0到1
前端·css·tensorflow
CDwenhuohuo2 小时前
微信小程序里用 setData() 修改数据并打印输出 的几种写法
javascript·微信小程序·小程序
不说别的就是很菜3 小时前
【前端面试】HTML篇
前端·html
前端一小卒3 小时前
生产环境Sourcemap策略:从苹果事故看前端构建安全架构设计
前端·javascript
im_AMBER3 小时前
React 18
前端·javascript·笔记·学习·react.js·前端框架
老前端的功夫3 小时前
Vue2中key的深度解析:Diff算法的性能优化之道
前端·javascript·vue.js·算法·性能优化
集成显卡3 小时前
AI取名大师 | PM2 部署 Bun.js 应用及配置 Let‘s Encrypt 免费 HTTPS 证书
开发语言·javascript·人工智能
han_3 小时前
前端高频面试题之Vue(高级篇)
前端·vue.js·面试