利用正则表达式批量最小化 .js 和 .css 文件

在Web开发中，压缩和最小化 JavaScript(.js) 和 CSS(.css) 文件至关重要，这能显著提升网站加载速度。 通常，我们需要将 .js 和 .css 文件重命名为 .min.js 和 .min.css 文件。本文介绍如何使用正则表达式高效地完成此任务。

问题： 我们需要处理一系列文件名，例如 pjax.min.js、pjax1.js、pjax.css 和 pjax1.min.css。目标是只将未经最小化的 .js 和 .css 文件（例如 pjax1.js 和 pjax.css）分别重命名为 pjax1.min.js 和 pjax.min.css，避免对已最小化的文件进行重复操作。

解决方案： 关键在于构建一个合适的正则表达式。 下面的正则表达式和替换函数可以完美解决这个问题：

const fileName = 'pjax1.js'; // 示例文件名
const newFileName = fileName.replace(/(\.[^.]+)$/, '.min$1');
console.log(newFileName); // 输出：pjax1.min.js

const fileName2 = 'pjax.min.css'; // 已最小化文件示例
const newFileName2 = fileName2.replace(/(\.[^.]+)$/, '.min$1');
console.log(newFileName2); // 输出：pjax.min.css (保持不变)

正则表达式 (\.[^.]+)$ 解释：

CSS婚礼策划服务机构宣传网站模板

CSS婚礼策划服务机构宣传网站模板是一款适合提供婚礼策划和婚庆服务机构宣传网站模板下载。提示：本模板调用到谷歌字体库，可能会出现页面打开比较缓慢。

下载

立即学习“前端免费学习笔记（深入）”；

• \.: 匹配一个点号 (.)，需要转义。
• [^.]+: 匹配一个或多个非点号的字符 (扩展名)。
• $: 匹配字符串结尾。
• (): 捕获组，将匹配到的扩展名保存到 $1 中。

替换函数 '.min$1' 解释：

• .min: 添加 .min 前缀。
• $1: 引用捕获组 $1 中保存的扩展名。

这个方法简洁高效，避免了对已最小化文件进行重复操作。 它能处理各种文件名，只要文件名以 .js 或 .css 结尾即可。 通过循环处理文件名列表，可以实现批量最小化。

通过这个正则表达式和替换函数，您可以轻松地批量处理文件，提高效率和代码可维护性。