如何修复ESLint报错：Parsing error: Unexpected reserved word 'await'

问题根源 #

1. 初始的Parsing error: Unexpected reserved word 'await'报错，是因为你在模块顶层直接使用await关键字，ES2022之前的JS标准不支持顶层await，旧版ESLint规则默认也会拦截这种写法。另外你初始代码里重复声明了client和slackUserEmails变量，属于基础语法错误需要先删除重复声明。
2. 后续修改后拿到空数组，是因为你把异步逻辑放在了自执行异步函数里，JS执行时会优先运行所有同步代码，你导出和打印slackUserNames的时候，Slack API的异步请求还没返回结果，所以拿到的还是初始的空数组。

解决方案 #

方案1：使用顶层await（推荐，环境支持的前提下）

如果你的项目使用ESM模块、Node版本 >= 14.8，或者使用vite/webpack5等支持顶层await的打包工具，可以先开启ESLint的顶层await支持，再直接用顶层await编写代码。

首先修改你的ESLint配置文件（.eslintrc.cjs或对应配置）：

{
  "parserOptions": {
    "ecmaVersion": 2022,
    "sourceType": "module"
  }
}

重构后的代码：

import { WebClient } from '@slack/web-api';
import { prSummaryBotEnvVariables } from '../pr-summary-bot-env/env-exported-variables.js';
import { getUsersFirstAndLastName, removeUndefinedValuesFromArray } from '../utils/utils.js';

const botToken = prSummaryBotEnvVariables();
const client = new WebClient(botToken.botUserOauthToken);
let slackUserEmails = [];

try {
  const { members } = await client.users.list();
  slackUserEmails = members.map(member => member.profile.email);
} catch (error) {
  console.error(error);
}

const slackUserNames = removeUndefinedValuesFromArray(getUsersFirstAndLastName(slackUserEmails));

export { slackUserNames };

其他文件引入这个模块时，会自动等待顶层await执行完成再运行后续逻辑。

方案2：导出异步函数（兼容性更好）

如果你的环境不支持顶层await，可以把逻辑封装成异步函数导出，让引入的地方调用时手动await即可。

重构后的代码：

import { WebClient } from '@slack/web-api';
import { prSummaryBotEnvVariables } from '../pr-summary-bot-env/env-exported-variables.js';
import { getUsersFirstAndLastName, removeUndefinedValuesFromArray } from '../utils/utils.js';

const botToken = prSummaryBotEnvVariables();
const client = new WebClient(botToken.botUserOauthToken);

export const getSlackUserNames = async () => {
  let slackUserEmails = [];
  try {
    const { members } = await client.users.list();
    slackUserEmails = members.map((member) => member.profile.email);
  } catch (error) {
    console.error(error);
  }
  return removeUndefinedValuesFromArray(getUsersFirstAndLastName(slackUserEmails));
};

其他文件引入使用的写法：

import { getSlackUserNames } from './你的当前文件路径.js';

async function yourBusinessLogic() {
  const slackUserNames = await getSlackUserNames();
  // 在这里写后续业务逻辑
}

内容的提问来源于stack exchange，提问作者Manuel Abascal