Svelte+TS+Eslint项目Eslint报'console'未定义错误如何修复

问题原因 #

该报错是Eslint未识别浏览器环境全局变量导致：你的tsconfig配置中已包含DOM库，因此TypeScript可以正确识别console等浏览器API的类型，但Eslint本身没有配置浏览器环境，所以会抛出'console' is not defined的错误。

修复方案（最推荐） #

直接在你的.eslintrc.yml配置文件中添加环境声明即可，修改后的配置新增env段如下：

# 原有配置不变，新增以下内容
env:
  browser: true
  es2022: true

extends:
  - eslint:recommended
  - plugin:@typescript-eslint/recommended
  - prettier
# 剩下的原有配置保持不变即可

配置中的browser: true会让Eslint自动识别所有浏览器环境的全局变量，包括console、window、document等，无需额外修改其他规则，也不会影响原有校验逻辑。

其他可选方案 #

如果你不想全局开启浏览器环境声明，也可以通过以下两种方式修复：

• 单独声明全局变量：在.eslintrc.yml中添加如下配置，仅将console注册为允许的全局变量

  globals:
    console: readonly
  

• 关闭no-undef校验规则：不推荐该方案，会丢失未定义变量的校验能力

  rules:
    # 原有规则不变，新增下面一行
    'no-undef': 'off'
  

配置修改完成后重启编辑器的Eslint服务即可生效。

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