webpack4和webpack5区别3---缓存

webpack4缓存

使用打包的目的是提升项目启动速度,提升开发体验,webpack的打包方式就是把项目内全部文件都走一遍loader和babel处理,所以项目文件内容越来越多,启动的时间就越来越长,随随便便就 run 一分钟。

webpack4 使用 hard-source-webpack-plugin

javascript 复制代码
module.exports = {
  plugins: [
    new HardSourceWebpackPlugin({
        cacheDirectory: './jenson/[confighash]', // 修改打包目录 dist/jenson
        // 自动清除配置
        cachePrune: {
          // 存储天数 10 day
          maxAge: 10 * 24 * 60 * 60 * 1000,
          // 最大存储 1G
          sizeThreshold: 1 * 1024 * 1024 * 1024,
        }
    })
  ],
}

webpack5缓存

cache 类型设置为内存或者文件系统。memory 选项很简单,它告诉 webpack 在内存中存储缓存,不允许额外的配置

Cache | webpack 中文文档

javascript 复制代码
module.exports = {
  cache: {
    type: 'filesystem',
    allowCollectingMemory: true,
  },
};
相关推荐
xuansec14 小时前
【Web攻防】文件与目录安全漏洞详解:下载/删除/遍历/穿越实操指南
前端
Beginner x_u14 小时前
CSS 动画体系(二)—— Animation关键帧动画
前端·css·animation
T-shmily14 小时前
CSS Grid 网格布局(display: grid)全解析
前端·css
Flywith2415 小时前
【每日一技】Warp Workflow 使用示例
android·前端
跟着珅聪学java15 小时前
Electron 读取 JSON 配置文件教程
前端·javascript·vue.js
GISer_Jing15 小时前
Agent技术深度解析:LLM增强智能体架构与优化
前端·人工智能·架构·aigc
難釋懷15 小时前
Redis主从-主从数据同步原理
前端·数据库·redis
a11177616 小时前
Markdown生成思维导图(html 开源)
前端·开源·html
我命由我1234516 小时前
React - state、state 的简写方式、props、props 的简写方式、类式组件中的构造器与 props、函数式组件使用 props
前端·javascript·react.js·前端框架·html·html5·js
钰衡大师16 小时前
Vue 3 源码学习教程
前端·vue.js·学习