错误:找不到模块“eslint-config-flowtype”

3

我正在尝试同时使用Webpack、ESLint和Flow类型。但是,当我启动webpack-dev-server时,会出现下面的错误消息。奇怪的是,eslint-config-flowtype甚至不是NPM中的模块。有人遇到过这个问题吗?提前感谢!

ERROR in ./src/index.jsx
Module build failed (from ./node_modules/eslint-loader/index.js):
Error: Cannot find module 'eslint-config-flowtype'
Referenced from: /Users/crs/code/my-project/.eslintrc.json
    at ModuleResolver.resolve (/Users/crs/code/react-builerplate/node_modules/eslint/lib/util/module-resolver.js:74:19)
    at resolve (/Users/crs/code/react-builerplate/node_modules/eslint/lib/config/config-file.js:479:28)
    at load (/Users/crs/code/react-builerplate/node_modules/eslint/lib/config/config-file.js:551:26)
    at configExtends.reduceRight (/Users/crs/code/react-builerplate/node_modules/eslint/lib/config/config-file.js:425:36)
    at Array.reduceRight (<anonymous>)
    at applyExtends (/Users/crs/code/react-builerplate/node_modules/eslint/lib/config/config-file.js:403:26)
    at loadFromDisk (/Users/crs/code/react-builerplate/node_modules/eslint/lib/config/config-file.js:523:22)
    at Object.load (/Users/crs/code/react-builerplate/node_modules/eslint/lib/config/config-file.js:559:20)
    at Config.getLocalConfigHierarchy (/Users/crs/code/react-builerplate/node_modules/eslint/lib/config.js:227:44)
    at Config.getConfigHierarchy (/Users/crs/code/react-builerplate/node_modules/eslint/lib/config.js:179:43)
 @ multi (webpack)-dev-server/client?http://localhost:8000 webpack/hot/dev-server react-hot-loader/patch webpack-dev-server/client?http://localhost:8080 webpack/hot/only-dev-server ./src/index.jsx

以下是我项目的所有依赖项:
  "dependencies": {
    "axios": "0.16.1",
    "babel-plugin-dynamic-import-webpack": "1.0.1",
    "babel-plugin-transform-decorators-legacy": "1.3.4",
    "babel-register": "6.24.1",
    "compression": "1.6.2",
    "cors": "2.8.3",
    "express": "4.15.3",
    "lodash": "4.17.4",
    "preact": "8.1.0",
    "preact-compat": "3.16.0",
    "prop-types": "^15.6.1",
    "prop-types-extra": "^1.1.0",
    "react": "^16.4.0",
    "react-addons-perf": "^15.4.2",
    "react-dom": "^16.4.0",
    "react-hot-loader": "3.0.0-beta.6",
    "react-redux": "^5.0.7",
    "react-router-dom": "^4.3.1",
    "redux": "^4.0.0",
    "redux-thunk": "^2.3.0",
    "styled-components": "^3.3.2",
    "webpack": "^4.11.1",
    "webpack-dev-middleware": "1.10.2",
    "webpack-hot-middleware": "2.18.0"
  },
  "devDependencies": {
    "babel-core": "6.24.1",
    "babel-eslint": "^8.2.3",
    "babel-loader": "^7.1.4",
    "babel-plugin-dynamic-import-node": "1.0.2",
    "babel-plugin-react-flow-props-to-prop-types": "^0.15.0",
    "babel-plugin-syntax-dynamic-import": "6.18.0",
    "babel-plugin-transform-class-properties": "6.24.1",
    "babel-plugin-transform-es2015-modules-commonjs": "6.24.1",
    "babel-preset-env": "1.5.1",
    "babel-preset-flow": "^6.23.0",
    "babel-preset-react": "6.24.1",
    "enzyme": "2.8.2",
    "eslint": "^4.19.1",
    "eslint-config-airbnb": "^16.1.0",
    "eslint-config-prettier": "^2.9.0",
    "eslint-config-react": "1.1.7",
    "eslint-loader": "^2.0.0",
    "eslint-plugin-flow": "2.29.1",
    "eslint-plugin-flowtype": "^2.49.3",
    "eslint-plugin-import": "^2.7.0",
    "eslint-plugin-jsx-a11y": "^6.0.3",
    "eslint-plugin-prettier": "^2.6.0",
    "eslint-plugin-react": "^7.1.0",
    "flow-bin": "^0.74.0",
    "husky": "^0.14.3",
    "jest": "20.0.4",
    "jest-serializer-enzyme": "1.0.0",
    "lint-staged": "^7.1.3",
    "moxios": "0.4.0",
    "nodemon": "1.11.0",
    "prettier": "^1.13.5",
    "prettier-eslint": "^8.8.1",
    "react-test-renderer": "15.5.4",
    "webpack-cli": "^3.0.3",
    "webpack-dev-server": "^3.1.4",
    "webpack-serve": "^1.0.3"
  }

.eslintrc.json

{
  "parser": "babel-eslint",
  "extends": [
    "flowtype",
    "plugin:flowtype/recommended",
    "airbnb",
    "prettier",
    "prettier/react"
  ],
  "plugins": [
    "prettier"
  ],
  "parserOptions": {
    "ecmaVersion": 2016,
    "sourceType": "module",
    "ecmaFeatures": {
      "jsx": true
    }
  },
  "env": {
    "es6": true,
    "browser": true,
    "node": true
  },
  "rules": {
    "prettier/prettier": "error",
    "flowtype/boolean-style": [
      2,
      "boolean"
    ],
    "flowtype/define-flow-type": 1,
    "flowtype/delimiter-dangle": [
      2,
      "never"
    ],
    "flowtype/generic-spacing": [
      2,
      "never"
    ],
    "flowtype/no-primitive-constructor-types": 2,
    "flowtype/no-types-missing-file-annotation": 2,
    "flowtype/no-weak-types": 2,
    "flowtype/object-type-delimiter": [
      2,
      "comma"
    ],
    "flowtype/require-parameter-type": 2,
    "flowtype/require-return-type": [
      2,
      "always",
      {
        "annotateUndefined": "never"
      }
    ],
    "flowtype/require-valid-file-annotation": 2,
    "flowtype/semi": [
      2,
      "always"
    ],
    "flowtype/space-after-type-colon": [
      2,
      "always"
    ],
    "flowtype/space-before-generic-bracket": [
      2,
      "never"
    ],
    "flowtype/space-before-type-colon": [
      2,
      "never"
    ],
    "flowtype/type-id-match": [
      2,
      "^([A-Z][a-z0-9]+)+Type$"
    ],
    "flowtype/union-intersection-spacing": [
      2,
      "always"
    ],
    "flowtype/use-flow-type": 1,
    "flowtype/valid-syntax": 1
  },
  "settings": {
    "flowtype": {
      "onlyFilesWithFlowAnnotation": false
    }
  }
}

@StefanPrifti,你安装了eslint-plugin-flowtype而不是eslint-config-flowtype,因此你收到了警告。 - Shubham Khatri
你能否发布你的.eslintrc.json文件? - Shubham Khatri
@ShubhamKhatri,其实没有什么花哨的。{ "parser": "babel-eslint", "extends": [ "flowtype", "airbnb", "prettier", "prettier/react" ], "plugins": [ "prettier" ], "parserOptions": { "ecmaVersion": 2016, "sourceType": "module", "ecmaFeatures": { "jsx": true } }, "env": { "es6": true, "browser": true, "node": true }, "prettier/prettier": "error" } - Stefan Prifti
1
请查看 https://github.com/gajus/eslint-plugin-flowtype,您可能需要像这样配置它:{ "extends": [ "plugin:flowtype/recommended" ], "plugins": [ "flowtype" ] } - Shubham Khatri
1
@ShubhamKhatri,我想你是对的。谢谢! - Stefan Prifti
显示剩余6条评论
2个回答

5

那导致我遇到了这个错误:https://dev59.com/alEG5IYBdhLWcg3wNm2o - Ryan

4
为了在ESlint中配置flowType,您需要像这样进行配置:
 "extends": [
    "plugin:flowtype/recommended",
    "airbnb",
    "prettier",
    "prettier/react"
  ],
  "plugins": [
    "prettier",
    "flowtype"
  ]

更多详情请查看此文档


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接