在Next.js项目中配置Applitools环境变量APPLITOOLS_API_KEY失败如何解决

问题根源 #

• Windows的set命令仅对当前打开的命令行会话生效，你执行完set命令后如果关闭了终端、新开了终端，或者在VSCode里重启了终端面板，之前设置的变量就会直接失效
• 如果你用的是PowerShell终端而非传统CMD，set命令本身不生效，需要用PowerShell专属的环境变量设置语法
• 如果你是分开终端执行变量设置和项目启动命令，会出现变量不生效的问题，必须保证两个操作在同一个终端会话中完成

正确操作方案 #

方案1：单次会话临时生效（符合官方文档操作逻辑） #

• 若使用传统CMD终端：
  1. 打开CMD，cd到你的Next.js项目根目录
  2. 执行set APPLITOOLS_API_KEY=替换为你的实际API密钥
  3. 同一窗口直接执行eyes-storybook对应的启动命令即可
• 若使用PowerShell终端（包括VSCode默认的Windows终端大多是PowerShell）：
  1. 打开PowerShell，cd到项目根目录
  2. 执行$env:APPLITOOLS_API_KEY="替换为你的实际API密钥"
  3. 同一窗口直接执行启动命令即可

方案2：全局永久生效（无需每次启动都设置变量） #

右键「此电脑」→「属性」→「高级系统设置」→「环境变量」，在「用户变量」或者「系统变量」板块新建变量，变量名填APPLITOOLS_API_KEY，变量值填你的实际API密钥，保存后重启所有终端/VSCode即可永久生效。

方案3：项目级配置（适合多项目切换场景） #

在你的Next.js项目根目录新建.env.local文件，写入如下内容：

APPLITOOLS_API_KEY=替换为你的实际API密钥

Next.js会自动读取该文件内的环境变量，无需每次手动设置，注意把.env.local加入.gitignore文件，避免密钥被提交到代码仓库。

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