在 ES Lint 中将 WebSocket 定义为 React Native 应用程序的全局

Posted

技术标签:

【中文标题】在 ES Lint 中将 WebSocket 定义为 React Native 应用程序的全局【英文标题】:Define WebSocket as a global in ES Lint for a React Native app 【发布时间】:2017-07-23 02:15:10 【问题描述】:

我收到以下 eslint 错误:

42:21  error  'WebSocket' is not defined  no-undef

您不能从 react-native 导入 WebSocket,因为它是一个全局变量,但是当我将 WebSocket 作为全局变量添加到我的 .eslintrc.yml 时,它不会改变错误的结果:

globals:
   WebSocket: true

如何在 ES Lint 中为 React Native 应用程序将 WebSocket 定义为全局?

这可以解决吗?目前我的 .eslintrc 看起来像这样:

env:
  browser: false
  es6: true
  commonjs: true
  node: true
extends: 'airbnb'
parser: babel-eslint
globals:
    WebSocket: true
parserOptions:
  ecmaFeatures:
    experimentalObjectRestSpread: true
    jsx: true
  sourceType: module
plugins:
  - react
  - react-native
rules:
  indent:
    - error
    - tab
    - "SwitchCase": 1
  linebreak-style:
    - error
    - unix
  quotes:
    - error
    - double
  semi:
    - error
    - never
  no-tabs: off
  max-len: off
  no-console: off
  no-plusplus: off
  global-require: off
  import/no-unresolved: off
  import/extensions: off
  class-methods-use-this: off
  react/jsx-no-bind: off
  react/forbid-prop-types: off
  react/prefer-stateless-function: off
  react/jsx-indent: [2, 'tab']
  react/jsx-indent-props: [2, 'tab']
  react/jsx-filename-extension: [1,  extensions: ['.js', '.jsx'] ]
  react/jsx-uses-react: error
  react/jsx-uses-vars: error
  react-native/no-unused-styles: 2
  react-native/split-platform-components: 2
  react-native/no-inline-styles: off
  react-native/no-color-literals: off

我可以使用内联注释摆脱它

/* globals WebSocket:true */

此外,当我不从 airbnb eslint 继承时,但我无法弄清楚 Airbnb 中的哪个 lint 规则负责阻止此操作。

【问题讨论】:

你是如何运行 eslint 的?另外你确定你的.eslintrc.yml文件在运行eslint时被使用了吗? 【参考方案1】:

根据您提供的信息,您的配置文件似乎由于某种原因没有被拾取。 globals 的配置看起来正确并且应该可以工作。为了弄清楚发生了什么,你应该做两件事。首先,您可以运行eslint --print-config path_to_some_js_file 来查看 ESLint 解决所有依赖项和级联后您的配置的样子。该配置很可能不会声明globals。之后,您可以运行eslint --debug path_to_file 来查看 ESLint 正在使用的所有配置文件。如果您的文件未包含在内,请检查所有其他配置文件并确认它们中没有 root: true(这将阻止 ESLint 合并父目录中的配置)。有关 CLI 标志的更多信息,您可以查看 ESLint documentation

【讨论】:

以上是关于在 ES Lint 中将 WebSocket 定义为 React Native 应用程序的全局的主要内容,如果未能解决你的问题,请参考以下文章

如何在 Vue 组件的外部脚本文件上运行 es-lint 规则

使用反应查询反应本机使用效果 es-lint 错误

配置Prettier与Es-lint格式化兼容

转译时排除 *.spec.ts 文件,但仍能正确 lint

Android 自定义Lint 基础教程

在 NodeJS 中将 WebSocket 连接到 WebSocketServer