VSCode搜索技巧

VSCode是时下最令行的前端开发工具，用好VSCode能极大的提高我们的开发效率，而搜索是日常开发中必不可少的操作，今天我们一起来聊聊VSCode中的搜索技巧。

普通的搜索我们就不谈了，今天主要介绍一下正则表达式搜索和一些小技巧。

匹配换行符

• [.|\n]* - 可以匹配任意字符，包括换行符。
• [\s\S] - 注意这种方式不好用。

一般情况下我们都是进行单行搜索，但是有些情况下我们需要跨行搜索，比如下面的React代码：

useEffect(() => {
  const lang = LocalStorageUtil.getLanguage();
  i18n.changeLanguage(lang);
}, []);

如果我想搜索所有依赖数组为空的useEffect调用，该怎么写这个正则表达式呢？大家可以先试试，反正我试了半天也没写出来，后来还是差DeepSeek才搞定，答案如下：

useEffect\((.|\n)*?,\s*\[\s*\]\s*\)

我们来解析一下这个正则表达式：

• useEffect - 匹配useEffect字符串
• \( - 匹配(字符，因为(是正则表达式中的特殊字符，所以需要转义。
• (.|\n)*? - 匹配任意字符，包括换行符，*?表示非贪婪匹配，尽可能少的匹配字符。
• , - 匹配,字符
• \s* - 匹配,与[]之间的任意空格字符，包括空格、制表符、换行符等，*表示匹配0次或多次。
• \[\s*\] - 匹配空的依赖数组，因为[和]是正则表达式中的特殊字符，所以需要转义。
• \s*\) - 匹配最后的右括弧，\s*表示[]与右括弧之间可能有空格。

这里面的关键是：(.|\n) - 它匹配任意字符包括换行符。

匹配markdown中的表格

在Markdown中，使用如下方式来生成表格。

| Name  | Age |
| ----- | --- |
| Tom   | 18  |
| Jerry | 20  |

如果我们要查找所有的markdown表格，那么我们只需要找出如下特征字符串即可

|------|-----|

可以使用如下的正则表达式：

\|\s*-+

我们来解析一下这个正则表达式：

• \| - 匹配|字符，因为|是正则表达式中的特殊字符，所以需要转义。
• \s* - 匹配|与-之间的任意空格字符。
• -+ - 匹配-字符，+表示匹配1次或多次。

这样，我们就可以查出所有的markdown表格了。你学会了吗？