钉钉H5微应用、微信H5微应用如何去掉缓存 |
您所在的位置：网站首页 › ios微信浏览器缓存怎么清 › 钉钉H5微应用、微信H5微应用如何去掉缓存 |
钉钉H5微应用、微信H5微应用如何去掉缓存
|
tips:此方案必须具备webpack配置能力 浏览器有缓存? 清除缓存就好了,这是大多数前端人员回复的解决方案. 那钉钉H5微应用、微信H5微应用有缓存? 通过钉钉APP强制清缓存,没错,可以达到目的.要是遇到不会清缓存的用户,而且其中偏偏就有你的boss,抓瞎,大脑emo中;考验语言组织能力的时候到了,忽悠得好升职加薪,忽悠不好关机领钱. 脑中一颤,这个问题不解决,凌晨4点的太阳见定了,头发也要见顶了.
灵机一动,有缓存,那就让他缓存,去适应他的缓存就好了,莫急,方案已在来的路上了. 此案例为spa webpack打包应用,其他技术栈可用该思想进行尝试,此方案不是终极解决方案,只能算我尝试后的最优解决方案,只能降低触发缓存的概率,并不能完全根除. ------清除钉钉h5微应用、微信h5微应用解决方案 开始------ 只要被缓存的文件没有更换,或者更换的文件并没有被缓存,那微应用打开是不是就不会触发缓存问题; 道理是这么个道理,咱说干就干,已经晚上10点了,一刻也不能耽误; 通过扒拉webpack4文档,它有3种打包方案hash、chunkHash、contentHash,contentHash打包方式恰巧与咱们的灵感重合(低于4版本可用chunkHash);心中一阵窃喜,我已经开始飘了,感觉10:30能回家;webpack出包设置方式如下图: output: { chunkFilename: `js/[id].[${process.env.NODE_ENV === 'production' ? 'contentHash' : 'hash'}].js`, // development不支持contentHash、chunkHash filename: `js/[name].[${process.env.NODE_ENV === 'production' ? 'contentHash' : 'hash'}].js`, // development不支持contentHash、chunkHash publicPath: '/', // 解决多路由错乱 },怎么解决别一下子把所有文件全部缓存呢? 再去扒拉webpack4文档,他有异步加载以及分包策略,这样它就不能全部缓存我的文件了,我突然间又行了,webpack分包配置如下: optimization: { // 将多入口的webpack运行时文件打包成一个 runtime文件 runtimeChunk: 'single', moduleIds: 'hashed', splitChunks: { chunks: 'all', // 拆分代码规则（符合即单独拆分到一个chunk中） maxInitialRequests: 4, // 在初始化加载时，请求数量大于4 automaticNameDelimiter: '-', name: true, // 代码块的名字，设置为true则表示根据模块和缓存组秘钥自动生成, 实现固化 chunkId，保持缓存的能力 /* 缓存组，用于继续细分代码。 缓存组默认将node_modules中的模块拆分带一个叫做vendors的代码块, 将最少重复引用两次的模块放入default中。 或者自定义将符合规则的模块单独拆分进一个chunk中。*/ cacheGroups: { default: false, // 禁用默认规则 vendors: false, // 禁用默认规则 vendor: { name: 'vendor', // 使用 vendor 入口作为公共部分 chunks: 'initial', test: /[\\/]node_modules[\\/]/, enforce: true, priority: -10, }, polyfill: { chunks: 'initial', test: 'polyfill', name: 'polyfill', }, // 对异步组件进行抽取 'async-vendor': { name: 'async-vendor', chunks: 'async', test: (module) => { // 缓存组的规则，表示符合条件的的放入当前缓存组 if (/[\\/]node_modules[\\/](echarts|zrender)/.test(module.context)) { return false; } return /[\\/]node_modules[\\/]/.test(module.context); }, }, 'async-biz': { name: 'async-biz', chunks: 'async', minChunks: 2, // 被引用次数大于2时进行拆分 }, // css文件单独打包进一个文件中 styles: { name: 'styles', test: /\.(less|css)$/, chunks: 'async', enforce: true, }, }, }, },继续肝,更改完webpack4配置反复的打包测试、对打包文件进行对比,发到钉钉,手指微微颤动的点击了一下界面,竟然没有触发缓存,连续试了多次,居然都没有触发缓存; 我看了看天花板,看了看表,又看了看天花板,又看了看表,瞬间泪如泉涌,表显时间10.31,那一分钟是对我骄傲的惩罚,肝完收工,明天继续肝. ------清除钉钉h5微应用、微信h5微应用解决方案 结束------ 看天花板,看了看表,又看了看天花板,又看了看表,瞬间泪如泉涌,表显时间10.31,那一分钟是对我骄傲的惩罚,肝完收工,明天继续肝. ------清除钉钉h5微应用、微信h5微应用解决方案 结束------ 作者: 半米飞行 详情: 清除钉钉h5微应用、微信h5微应用解决方案 |
【本文地址】
今日新闻 |
推荐新闻 |