Safari 下 js 文件不能以 gz格式压缩

      今天是农历春节后上班的第一天。上午收到一个紧急的邮件。说是在苹果电脑下看到Resource-Admin程序显示不正常。Resource-Admin是一个以Extjs和Java开发的web程序。

      既然是显示不正常,我首先想到的是浏览器不兼容。于是,我首先从苹果电脑常用的浏览器Safari下手,到处找 Extjs 在safari下的兼容问题。可惜的是网上似乎没有这样的资料。然后我用Safari查看了我以前做的其他的web程序。就算是相当复杂的结构在safari下也都显示正常。正在苦思不得其解的时候,我无意中问了一下同一办公室也做web程序的周卡,他过来看了一眼,就发现了问题。在这个Resource-Admin项目中使用了gz格式来压缩js文件。这个好像不能被Safari识别出来。在其指导之下,我终于比较清楚了。现将步骤归纳如下:

 

1、将所有的.gz文件改名为.jgz

2、在web.xml中 将原有

    <filter-mapping>
          <filter-name>gzipFilter</filter-name>
          <url-pattern>*.gz</url-pattern>
     </filter-mapping>

   改成:

     <filter-mapping>
          <filter-name>gzipFilter</filter-name>
          <url-pattern>*.jgz</url-pattern>
     </filter-mapping>

 

const path = require("path"); const productionGzipExtensions = ["js", "css"]; const CompressionWebpackPlugin = require("compression-webpack-plugin"); // 开启压缩 const TerserPlugin = require("terser-webpack-plugin"); // 代码压缩和混淆 module.exports = { configureWebpack: (config) => { const isProduction = process.env.NODE_ENV === "production"; const isMiniProgram = process.env.UNI_PLATFORM?.startsWith("mp-"); // 生产环境 + 小程序 启用增强混淆 if (isProduction && isMiniProgram) { config.optimization = config.optimization || {}; config.optimization.minimizer = [ new TerserPlugin({ terserOptions: { compress: { drop_console: false, // 小程序开发可能需要保留 console,上线时可改为 true drop_debugger: true, // 移除 debugger pure_funcs: ["console.log", "console.debug"], // 移除指定的函数调用(不影响 console.error 和 console.warn) passes: 3, // 多次压缩以获得更好的压缩效果 unsafe: true, // 启用不安全的优化 unsafe_comps: true, // 压缩比较表达式 unsafe_math: true, // 优化数学表达式 unsafe_proto: true, // 优化原型链 unsafe_regexp: true, // 优化正则表达式 dead_code: true, // 移除死代码 unused: true, // 移除未使用的变量 collapse_vars: true, // 内联变量 reduce_vars: true, // 减少变量使用 evaluate: true, // 计算常量表达式 side_effects: false, // 保留副作用(小程序环境需要) }, mangle: { // 混淆变量名和函数名 toplevel: false, // 小程序环境建议设为 false,避免影响全局变量和 uni-app 框架 properties: false, // 小程序环境必须关闭属性混淆,避免影响组件属性绑定 safari10: true, // 兼容 Safari 10 }, format: { comments: false, // 移除所有注释 ascii_only: true, // 转义 Unicode 字符为 ASCII,避免小程序编码问题 beautify: false, // 不美化输出,保持压缩格式 }, keep_classnames: false, // 混淆类名 keep_fnames: false, // 混淆函数名 ecma: 2015, // 指定 ECMAScript 版本,兼容小程序环境 }, extractComments: false, // 不提取注释到单独文件 parallel: true, // 使用多进程并行运行,加快构建速度 minify: TerserPlugin.terserMinify, // 使用 terser 压缩 }), ]; } // 添加 Gzip 压缩插件 config.plugins = config.plugins || []; config.plugins.push( new CompressionWebpackPlugin({ // 生成的压缩文件格式,保留原路径和查询参数,例如 app.js → app.js.gz filename: "[path].gz[query]", //使用 gzip 压缩算法 algorithm: "gzip", // 正则匹配需要压缩文件,匹配 .js 和 .css test: new RegExp("\\.(" + productionGzipExtensions.join("|") + ")$"), // 只压缩大于 100KB(102400 字节)的文件 threshold: 102400, // 压缩后体积小于原体积 80% 才生成压缩文件 minRatio: 0.8, // 保留原始文件,不删除 deleteOriginalAssets: false, //是否删除源文件 }) ); return config; }, };
11-07
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值