应该在项目的依赖项中列出eslint，而不是devDependencies

Question

要么我不理解节点100%中的dependencies和devDependencies，要么就是eslint在这里是错误的(不能正确分析它)：

   3:1   error  'chai' should be listed in the project's dependencies, not devDependencies              import/no-extraneous-dependencies
   4:1   error  'chai-enzyme' should be listed in the project's dependencies, not devDependencies       import/no-extraneous-dependencies
   5:1   error  'enzyme' should be listed in the project's dependencies, not devDependencies            import/no-extraneous-dependencies
   7:1   error  'sinon' should be listed in the project's dependencies, not devDependencies             import/no-extraneous-dependencies
   9:1   error  'redux-mock-store' should be listed in the project's dependencies, not devDependencies  import/no-extraneous-dependencies

这些都是测试依赖，那么为什么要在dependencies中列出它们呢？

补充说明:我们使用Travis作为我们的CI，所以我也不知道这是否会有所不同。

Answer 1

通过将这个添加到我的.eslintrc中解决了这个问题：

"import/no-extraneous-dependencies": ["error", {"devDependencies": true}]

[no-extraneous-dependencies] Add exceptions? #422

基于此用户回复的

您可以在测试文件夹的.eslintrc中设置选项devDependencies: true：

规则:导入/无-外部-依赖关系:错误，{ devDependencies: true }然后您将获得未包含依赖关系或devDependencies的任何引用的包的报告。然后，你就可以得到规则的好处了，没有来自注释的噪音。

我想这可能对你有用吧？在您的例子中，这就是我使用规则的方式，因为您已经将测试代码分离到一个测试目录中。

这篇文章也有助于确认我并没有疯，不想在我的依赖列表中加入其中的一些：Sharable ESLint Config

Answer 2

如果您希望仅允许在测试文件中导入devDependencies，则可以使用array of globs，如documentation of no-extraneous-dependencies所述：

使用glob数组时，如果要链接的文件的名称与数组中的单个glob匹配，则该设置将设置为true (不报告错误)，否则设置为false。

以下设置将仅禁用测试文件的lint。

"import/no-extraneous-dependencies": ["error", {"devDependencies": ["**/*.test.ts", "**/*.test.tsx"]}]

这样，从devDependencies导入的内容仍然会被报告为错误。

Answer 3

我能够通过将缺少的包(在我的例子中是Typescript和Storybook)添加到我的.eslintrc中的plugins目录来解决这个问题。

我在这篇文章中给出了细节：ESLint error: '@storybook/react' should be listed in the project's dependencies, not devDependencies