如何在Jest中使用ESLint


252

我正在尝试将ESLint linter与Jest测试框架一起使用。

开玩笑的测试是与某些全局变量一起运行的,例如jest,我需要告诉linter;但是棘手的是目录结构,通过Jest,测试是与源代码一起嵌入在__tests__文件夹中的,因此目录结构类似于:

src
    foo
        foo.js
        __tests__
            fooTest.js
    bar
        bar.js
        __tests__
            barTest.js

通常,我会将所有测试都放在一个目录下,并且可以在其中添加.eslintrc文件以添加全局变量...但是我当然不想.eslintrc在每个__test__目录中都添加文件。

现在,我刚刚将测试全局变量添加到了全局.eslintrc文件中,但是由于那意味着我现在可以jest在非测试代码中进行引用,因此这似乎不是“正确的”解决方案。

是否有办法让eslint根据基于目录名称的某种模式来应用规则,或者类似的方法?


1
对于实际的答案来说,这有点太残酷了,但是您可以有一个单独的整理任务,该任务手动使用eslint-test带有glob 的文件,例如eslint **/__tests__/*.js -c eslint-test.yml。话虽如此,我认为没有一个jestbeforeEach全球泄漏到生产代码中的危险很大;)
Nick Tomlin

Answers:


669

文档显示您现在可以添加:

"env": {
    "jest": true
}

.eslintrc可以在其中添加所有与玩笑相关的内容,从而消除棉绒错误/警告。


27
使用此方法,在与“ .test.js”或“ __tests __ / .js”模式匹配的文件外部使用“ describe”或“ it” 不会导致掉毛错误。有什么办法可以做到这一点?
n1ru4l

7
@ l0rin您可以在文件夹中添加一个.eslintrc扩展默认值.eslintrc__tests__文件。如果您遇到与OP(多个测试文件夹)相同的问题,则可以.eslintrc使用模板和一个小的bash脚本(类似ls **/__tests/ | xargs cp templates/.eslintrc)生成那些文件
Ulysse BN

2
相关链接在这里
devonj '18

73

ESLint从版本> = 4开始支持此功能:

/*
.eslintrc.js
*/
const ERROR = 2;
const WARN = 1;

module.exports = {
  extends: "eslint:recommended",
  env: {
    es6: true
  },
  overrides: [
    {
      files: [
        "**/*.test.js"
      ],
      env: {
        jest: true // now **/*.test.js files' env has both es6 *and* jest
      },
      // Can't extend in overrides: https://github.com/eslint/eslint/issues/8813
      // "extends": ["plugin:jest/recommended"]
      plugins: ["jest"],
      rules: {
        "jest/no-disabled-tests": "warn",
        "jest/no-focused-tests": "error",
        "jest/no-identical-title": "error",
        "jest/prefer-to-have-length": "warn",
        "jest/valid-expect": "error"
      }
    }
  ],
};

这是eslint config的“扩展覆盖范围”限制的变通方法(来自此处的另一个答案,请投票!):

overrides: [
  Object.assign(
    {
      files: [ '**/*.test.js' ],
      env: { jest: true },
      plugins: [ 'jest' ],
    },
    require('eslint-plugin-jest').configs.recommended
  )
]

来自https://github.com/eslint/eslint/issues/8813#issuecomment-320448724


4
谢谢,这实际上是解决此问题的正确方法。为我工作!
sra

1
这很棒!通过将我的ESLint更新到版本> = 4并向中添加"files""env"对象"overrides"eslint.rc我不再需要担心Jest特定语法在测试文件之外传递lint。
TheDarkIn1978 '18

1
出色的解决方案,当您使用非标准的文件夹结构时,也可用于其他框架(茉莉花)。
Elliot Nelson

2
我是撰写接受答案的人-这个答案比我的要好得多!尽管当时我写了答案,但这是很好地解决此问题的唯一方法。
戴夫·库珀

6
ESLint现在支持扩展的覆盖
尼克·麦柯迪

21

您还可以在测试文件中设置测试环境,如下所示:

/* eslint-env jest */

describe(() => {
  /* ... */
})


2

基于模式的配置计划在ESLint 2.0.0版本中发布。但是,到目前为止,您将必须创建两个单独的任务(如注释中所述)。一个用于测试,另一个用于测试其余代码,然后运行它们,同时提供不同的.eslintrc文件。

PS:ESLint的下一版本中有一个有趣的环境,它将注册所有必需的全局变量。


2

我解决了问题REF

# For Yarn
yarn add eslint-plugin-jest -D

# For NPM
npm i eslint-plugin-jest -D

然后添加您的.eslintrc文件

{
    "extends": ["airbnb","plugin:jest/recommended"],
}

1

仅为__tests__文件夹添加环境

您可以.eslintrc.yml__tests__文件夹中添加一个文件,以扩展您的基本配置:

extends: <relative_path to .eslintrc>
env:
    jest: true

如果只有一个__tests__文件夹,则此解决方案是最佳解决方案,因为它仅在需要的地方作用域范围。

处理许多测试文件夹

如果您有更多测试文件夹(OPs情况),我仍然建议添加这些文件。如果您有大量的这些文件夹,可以使用简单的zsh脚本添加它们:

#!/usr/bin/env zsh

for folder in **/__tests__/ ;do
    count=$(($(tr -cd '/' <<< $folder | wc -c)))
    echo $folder : $count
    cat <<EOF > $folder.eslintrc.yml
extends: $(printf '../%.0s' {1..$count}).eslintrc
env:
    jest: true
EOF
done

该脚本将查找__tests__文件夹.eslintrc.yml,并向上面显示的配置添加文件。该脚本必须在包含您的父文件夹的文件夹中启动.eslintrc



-8

在您的.eslintignore文件中,添加以下值:

**/__tests__/

这应该忽略__tests__目录的所有实例及其子级。


4
那不是我想要的,我不想忽略测试文件,我仍然想对它们进行整理,我只想弄清楚如何指定必要的选项来正确地整理它们。
Retsam 2015年

2
eslint的想法很糟糕,可以帮助所有代码-包括测试代码。
Daniel Kmak
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.