如何自动将单个JS文件中的大量变量按字母顺序排序？

问题场景 #

我有一个包含约1000个导出组件的JS/TS文件，示例代码如下：

export const FruitOrange: React.FC = () => (
    <Trans id="fruit.orange">Orange</Trans>
);
export const FruitApple: React.FC = () => (
    <Trans id="fruit.apple">Apple</Trans>
);

需要将所有变量按字母顺序排序，让FruitApple排在FruitOrange之前。尝试过VSCode原生功能、PHPStorm的代码排列规则，均未成功实现，需要一次性自动完成排序的方法。

可行解决方案 #

方法1：Node.js脚本（最可靠可控） #

写一个简单的Node.js脚本，批量提取、排序并重新生成文件内容：

1. 创建一个名为sort-exports.js的文件，写入以下代码：

const fs = require('fs');
const path = require('path');

// 替换为你的目标文件路径
const targetFile = path.resolve(__dirname, 'your-components.js');

fs.readFile(targetFile, 'utf8', (readErr, content) => {
  if (readErr) {
    console.error('读取文件出错:', readErr);
    return;
  }

  // 匹配每个完整的export组件块（适配你的代码格式）
  const exportBlockRegex = /export const (\w+): React\.FC = \(\) => \([\s\S]+?\);/g;
  const exportBlocks = [];
  let matchResult;

  // 提取所有块及对应的变量名
  while ((matchResult = exportBlockRegex.exec(content)) !== null) {
    exportBlocks.push({
      variableName: matchResult[1],
      blockContent: matchResult[0]
    });
  }

  // 按变量名字母顺序排序
  exportBlocks.sort((a, b) => a.variableName.localeCompare(b.variableName));

  // 拼接排序后的内容
  const sortedContent = exportBlocks.map(block => block.blockContent).join('\n\n');

  // 写入新文件（避免覆盖原文件）
  const outputFile = targetFile.replace(/(\.\w+)$/, '-sorted$1');
  fs.writeFile(outputFile, sortedContent, 'utf8', (writeErr) => {
    if (writeErr) {
      console.error('写入文件出错:', writeErr);
      return;
    }
    console.log(`排序完成，已生成文件：${outputFile}`);
  });
});

2. 替换代码中的your-components.js为你的实际文件路径。
3. 在终端运行：node sort-exports.js，脚本会生成一个带-sorted后缀的排序后文件。

方法2：文本编辑器正则+排序功能（快速无代码） #

以Sublime Text为例：

• 打开目标文件，按下Ctrl+F（Windows/Linux）或Cmd+F（Mac）打开查找面板。
• 点击面板左侧的正则图标（.*），输入查找规则：^export const.*?;
• 勾选面板底部的Wrap和Regex选项，点击Find All，所有导出块会被选中。
• 点击顶部菜单编辑 → 排序 → 按字母顺序排序（Sort Lines Alphabetically），即可完成排序。

VSCode也可以通过类似方式实现：安装Sort Lines扩展后，用正则选中所有导出块，按下Ctrl+Shift+P调用Sort Lines: Sort Lines Alphabetically命令。

内容的提问来源于stack exchange，提问作者Patrick Kenny