React项目中解决“Accelerometer is not defined” no-undef报错

这个报错是因为React项目默认启用的ESLintno-undef规则，会把未显式声明的变量标记为未定义——而Accelerometer是浏览器提供的全局Sensor API，在Node.js编译环境（React构建依赖Node）中不会被识别为全局变量，所以触发了这个错误。以下是几种可行的解决方式：

方法1：显式从window对象获取API #

直接通过window.Accelerometer访问，明确告知ESLint这是浏览器全局对象上的属性：

const acl = new window.Accelerometer({ frequency: 60 });

方法2：告诉ESLint这是全局变量 #

在使用Accelerometer的文件顶部添加ESLint注释，声明该变量为全局：

/* global Accelerometer */
const acl = new Accelerometer({ frequency: 60 });
// 其余代码不变

或者在项目根目录的.eslintrc.js（或对应的ESLint配置文件）中，将Accelerometer添加到globals配置里，全局生效：

module.exports = {
  // 其他配置...
  globals: {
    Accelerometer: 'readonly'
  }
};

方法3：添加兼容性检查（可选） #

由于Accelerometer并非所有浏览器都支持，建议在代码中增加兼容性判断，避免在不支持的环境中报错：

if ('Accelerometer' in window) {
  const acl = new Accelerometer({ frequency: 60 });
  // 后续的事件监听等逻辑放在这里
} else {
  console.error('当前浏览器不支持Accelerometer API');
}

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